django項目網易雲音樂

項目說明

網易雲項目

語言：python
前端: bootstarp
後端: django
資料庫:sqlite3

項目說明

python爬蟲爬取網易雲的歌曲名稱和連結，并儲存到資料庫中
使用bootstarp編寫前端界面
使用django前後端互動

第一部分爬取網易雲音樂歌曲名稱和連結并且存到資料庫

from asyncio.windows_events import NULL

import requests
import re
from multiprocessing import Pool
import urllib
import sqlite3

headers = {
    'Referer': 'https://music.163.com/',
    "User-Agent": "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.89 "
                  "Safari/537.36"
}

def get_page(url):
    res = requests.get(url, headers=headers)
    data = re.findall('<a title="(.*?)" href="/playlist\?id=(\d+)" target="_blank" rel="external nofollow"  class="msk"></a>', res.text)
    #print(data)

    pool = Pool(processes=4)
    pool.map(get_songs, data[:len(data) - 1])
    #print("下載下傳完畢！")


def get_songs(data):
    #print(data[1])
    playlist_url = "https://music.163.com/playlist?id=%s" % data[1]
    res = requests.get(playlist_url, headers=headers)

    for i in re.findall(r'<a href="/song\?id=(\d+)" target="_blank" rel="external nofollow" >(.*?)</a>', res.text):

        try:
            #print("Downing--" + i[1])
            ID = i[0]
            url = 'https://music.163.com/song/media/outer/url?id='
            req = requests.get(url + ID, headers=headers, allow_redirects=False)
            musicLink = req.headers['Location']

            if(len(musicLink)>30):
                 savesql(i[1],musicLink)
                 #print(i[1])#這個是歌曲名字

                 #print(musicLink)#這個是歌曲連結
            #urllib.request.urlretrieve(musicLink, 'C:\\網易雲\\' + i[1] + '.mp3')
            #print("Dend Downing + " + i[1])

        except FileNotFoundError:
            pass
        except OSError:
            pass
def savesql(name, link, null=None):#null的設定是為了自增
    conn = sqlite3.connect('db.sqlite3')
    c=conn.cursor()

    c.execute('''CREATE TABLE IF NOT EXISTS common_music
              (musicname text,link text)''')
    c.execute("INSERT INTO common_music VALUES (?,?,?)", (null,name,link))
    conn.commit()  # 送出事務
    conn.close()
    print(name,link)

if __name__ == '__main__':
    # hot_url = "https://music.163.com/discover/playlist/?order=hot"
    #for i in range(0, 1, 35):
    for i in range(0, 1):
        hot_url = 'https://music.163.com/discover/playlist/?order=hot&cat=全部&limit=35&offset=' + str(i)
        get_page(hot_url)

這裡中的savesql函數裡面包含了建立資料庫，建立表，以及添加資料等操作

bootstarp前端内容

第一部分：登陸界面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
      <style>
        * {
            margin: 0;
            padding: 0;
            text-decoration: none;
            font-family: montserrat;
        }

        body {
            min-height: 100vh;
            background-image: linear-gradient(120deg, #3498db, #8344ad);
        }

        .login-form {
            width: 360px;
            background: #f1f1f1;
            height: 580px;
            padding: 80px 40px;
            border-radius: 10px;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
        }

        .login-form h1 {
            text-align: center;
            margin-bottom: 60px;
        }

        .txtb {
            border-bottom: 2px solid #adadad;
            position: relative;
            margin: 30px 0;
        }

        .txtb input {
            font-size: 15px;
            color: #333;
            border: none;
            width: 100%;
            outline: none;
            background: none;
            padding: 0 5px;
            height: 40px;
        }

        .txtb span::before {
            content: attr(data-placeholder);
            position: absolute;
            top: 50%;
            left: 5px;
            color: #adadad;
            transform: translateY(-50%);
            z-index: -1;
            transition: .5s;
        }

        .txtb span::after {
            content: '';
            position: absolute;
            width: 0%;
            height: 0%;
            background: linear-gradient(120deg, #3498db, #8e44ad);
            transition: .5s;
        }

        .focus+span::before {
            top: -5px;
        }

        .focus+span::after {
            width: 100%;
        }

        .logbtn {
            display: block;
            width: 100%;
            height: 50px;
            border: none;
            background: linear-gradient(120deg, #3498db, #8e44ad, #3498db);
            background-size: 200%;
            color: #fff;
            outline: none;
            cursor: pointer;
            transition: .5s;
        }

        .logbtn:hover {
            background-position: right;
        }

        .bottom-text {
            margin-top: 60px;
            text-align: center;
            font-size: 13px;
        }
    </style>
</head>
<body>
  <!--  <form action="/datail/" method="post">
        <input type="text" name="username">
        <input type="password" name="password">
        <input type="submit" value="登入">
        <a href="admin_add_user.html" target="_blank" rel="external nofollow" ><input type="button" value="注冊"></a>
    </form>
   -->
     <form action="/datail/" method="post" class="login-form">
        <h1>歡迎來到音樂</h1>
        <div class="txtb">
            <input type="text" name="username">
            <span data-placeholder="Username"></span>
        </div>

        <div class="txtb">
            <input type="password" name="password">
            <span data-placeholder="Password"></span>
        </div>

        <input type="submit" class="logbtn" value="登入">
		<input type="reset" class="logbtn" value="重置" style=" margin-top: 10px;">
        <div class=" bottom-text">
            沒有賬戶? <a href="admin_add_user.html">點我注冊</a>
        </div>
    </form>
    <script type="text/javascript">
        $(".txtb input").on("focus", function () {
            $(this).addClass("focus")
        });

        $(".txtb input").on("blur", function () {
            if ($(this).val() == "")
                $(this).removeClass("focus");
        });
    </script>

</body>
</html>

第二部分:注冊界面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <title>Title</title>

</head>
<body>


<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Music</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link" href="#">我的音樂 <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">主界面</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Dropdown
        </a>
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form>
  </div>
</nav>


<div class="container">
    <div class="row justify-content-center">
         <div class="row" style="align-items: baseline">
          <div class="card" style="width: 18rem;">
                <img class="card-img-top" src="https://tva1.sinaimg.cn/mw1024/006yt1Omgy1ghu6dr0paxj31b41wkkjn.jpg" alt="Card image cap">
                   <div class="card-body">
                         <h5 class="card-title">ID</h5>
                          <p class="card-text">在這個框内輸入一個整數數字</p>
                          <a href="#" class="btn btn-primary">Go somewhere</a>
                    </div>
         </div>
          <div class="card" style="width: 18rem;">
              <img class="card-img-top" src="https://tva1.sinaimg.cn/mw1024/006yt1Omgy1ghu6dr0paxj31b41wkkjn.jpg" alt="Card image cap">
                  <div class="card-body">
                         <h5 class="card-title">music</h5>
                         <p class="card-text">資料源于爬蟲爬取網易雲資料</p>
                         <a href="#" class="btn btn-primary">Go somewhere</a>
                  </div>
    </div>
          <div class="card" style="width: 18rem; align-items: baseline">
              <img class="card-img-top" src="https://tva1.sinaimg.cn/mw1024/006yt1Omgy1ghu6dr0paxj31b41wkkjn.jpg" alt="Card image cap">
                  <div class="card-body">
                        <h5 class="card-title">前後端互動</h5>
                        <p class="card-text">本界面僅僅是添加使用者</p>
                        <a href="#" class="btn btn-primary">Go somewhere</a>
                  </div>
         </div>

    </div>
    </div>
        <!--card-->
   <div class="row justify-content-center" >
       <form action="/admin_add_user/" method="post">
       <!--<p><input name="id" /></p>
        <p><input name="username" /></p>
        <p><input name="password" /></p>
        <p><input type="submit" value="submit" /></p>
        <p><a href="index.html" target="_blank" rel="external nofollow" >傳回</a></p>
        -->
        <div class="form-row align-items-center">
            <div class="col-auto">
              <label class="sr-only" for="inlineFormInput">ID</label>
              <input type="text" class="form-control mb-2" id="inlineFormInput" placeholder="ID" name="id">
            </div>
            <div class="col-auto">
              <label class="sr-only" for="inlineFormInputGroup">Username</label>
              <div class="input-group mb-2">
                <input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Username" name="username">
              </div>
            </div>
            <div class="col-auto">
               <label class="sr-only" for="inlineFormInput">Name</label>
              <input type="text" class="form-control mb-2" id="inlineFormInput" placeholder="Password" name="password">
            </div>
            <div class="col-auto">
              <button type="submit" class="btn btn-primary mb-2" value="submit">Submit</button>
            </div>
        </div>
     </form>
   </div>
     <!--表單-->


</div>
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
		<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>

第三部分:登入成功的界面

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
	<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
table {
    border-collapse: collapse;
}
th, td {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}
</style>
</head>
    <body>
    <!--導航欄-->
    <nav class="navbar navbar-inverse" role="navigation" style="margin: 0px;padding: 0px">
	    <div class="container-fluid">
             <div class="navbar-header">
                  <a class="navbar-brand" href="#">白熊音樂</a>
            </div>
        <div>
        <div class="navbar-header" style="padding-left: 60px">
            <a class="navbar-brand" href="#">發現音樂</a>
        </div>
        <div class="navbar-header" style="padding-left: 60px">
            <a class="navbar-brand" href="#">我的音樂</a>
        </div>

        <!--下拉清單-->
        <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    music <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#">注冊</a></li>
                    <li><a href="#">登入</a></li>
                    <li><a href="#">網易雲</a></li>
                    <li class="divider"></li>
                    <li><a href="#">登出</a></li>
                    <li class="divider"></li>
                    <li><a href="#">酷狗</a></li>
                </ul>
            </li>
        </ul>
        <!--登入注冊-->
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#"><span class="glyphicon glyphicon-user"></span> 注冊</a></li>
            <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> 登入</a></li>
        </ul>
             <!--搜尋按鈕-->
        <form class="navbar-form navbar-nav navbar-right" role="search">
             <div class="form-group">
                  <input type="text" class="form-control" placeholder="Search">
            </div>
            <button type="submit" class="btn btn-default">查找音樂</button>
        </form>

    </div>
	</div>
    </nav>
    <!--輪播圖-->


     <div id="myCarousel" class="carousel slide" style="margin-top: 0">
    <!-- 輪播（Carousel）名額
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
     輪播（Carousel）項目 -->
    <div class="carousel-inner"  >
        <div class="item active">
            <img src="https://tvax1.sinaimg.cn/mw1024/006yt1Omgy1gig64nuyi3j317r17rnpd.jpg" alt="First slide" style="width: 100%;height: 400px">
        </div>
        <div class="item">
            <img src="https://tva4.sinaimg.cn/mw1024/006yt1Omgy1gig65kwln3j32o7220kjo.jpg" alt="Second slide" style="width: 100%;height: 400px">
        </div>
        <div class="item">
            <img src="https://tva3.sinaimg.cn/mw1024/006yt1Omgy1gig653msc2j312n12hb29.jpg" alt="Third slide" style="width: 100%;height: 400px">
        </div>
    </div>
    <!-- 輪播（Carousel）導航 -->
    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>
    <!--内容-->

         <table class="table table-hover">
             <thead>
                <tr class="success">
                    <th>id</th>
                    <th>音樂名稱</th>
                    <th>音樂連結</th>
                </tr>
             </thead>
             <tbody>
                    {% for item in li %}
                        <tr class="danger">
                            <td>{{ item.id }}</td>
                            <td>{{ item.name }}</td>
                            <td><a href="{{ item.link }}">{{item.link}}</a></td>
                        </tr>
                    {% endfor %}
             </tbody>
        </table>

    <div class="jumbotron text-center" style="margin-bottom:0">
        <p>站點音樂來自網易雲</p>
    </div>

    </body>
</html>

這下面的部分是前後端互動的部分

{% for item in li %}
                        <tr class="danger">
                            <td>{{ item.id }}</td>
                            <td>{{ item.name }}</td>
                            <td><a href="{{ item.link }}">{{item.link}}</a></td>
                        </tr>
                    {% endfor %}

最後放上我的項目連結，如果你安裝了python并且使用了pycharm或者vs code 安裝了django架構，直接拿去用吧

連結：https://pan.baidu.com/s/1ReoQD5HZKORMl6JDBWyyNQ

提取碼：1234

django項目網易雲音樂

項目說明

網易雲項目

項目說明

第一部分爬取網易雲音樂歌曲名稱和連結并且存到資料庫

bootstarp前端内容

繼續閱讀

TestLink導出用例轉換工具(XML2Excel)

YAML簡介和PyYAML安全操作YAML支援的類型YAML的優點：yaml的基本文法python操作

Small tricks

libsvm for python 安裝

學習軟體測試基礎測試第七天

Zeppelin 配置通路 REST APIApache Zeppelin Configuration REST API

【Torch】最簡潔logging使用指南

27. Remove Element(清單)題目代碼

Cloud Studio初體驗

使用 ctypes 進行 Python 和 C 的混合程式設計

【python】【資料處理】畫多元資料分布圖

【python】netconf協定對接管理裝置

「Python 網絡自動化」NETCONF —— Python 使用 NETCONF 管理配置 H3C 網絡裝置

layui多任務上傳添加進度條

在python中建立excel并寫入

django項目 網易雲音樂

項目說明

網易雲項目

項目說明

第一部分爬取網易雲音樂歌曲名稱和連結并且存到資料庫

bootstarp前端内容

繼續閱讀

django項目網易雲音樂