---
# System prepended metadata

title: '[雲端] backend'
tags: [雲端, accept, application/json, backend, headers]

---

[雲端] backend
===
###### tags: `雲端`, `backend`, `headers`, `accept`, `application/json`

<br>

[TOC]

<br>


# Flask
## 安裝
```bash
# flask_cors 是處理 CORS policy
pip install flask flask_cors
```
- CORS: Cross-Origin Resource Sharing 跨來源資源共用

<br>

## 基本核心
```python=
from flask import Flask
import json

app = Flask("backend_server")

def init():
    print('init')

@app.route('/')
def index():
    return 'The backend server works!'

if __name__ == '__main__':
    init()
    app.run(host='0.0.0.0', port=19998, debug=True)
```

<br>

## 跨站問題
```javascript=
// 不在同一網站上測試，會遇到 CORS policy
response = await fetch('http://10.78.26.241:19998/');
```
```
Access to fetch at 'http://10.78.26.241:19998/' from origin 'null' has been 
blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present 
on the requested resource. If an opaque response serves your needs, set the
request's mode to 'no-cors' to fetch the resource with CORS disabled.

GET http://10.78.26.241:19998/ net::ERR_FAILED
(anonymous)

Uncaught TypeError: Failed to fetch
```

<br>

**處理方式**：使用 `@cross_origin()`
```python=
from flask import Flask
from flask_cors import cross_origin
import json

app = Flask("backend_server")

def init():
    print('init')

@app.route('/')
@cross_origin()
def index():
    return 'The backend server works!'

if __name__ == '__main__':
    init()
    app.run(host='0.0.0.0', port=19998, debug=True)
```
![](https://i.imgur.com/yQOb5Jk.png)

<br>

## GET 參數
> 使用 `request.args.get('XXX')`
```python=
from flask import Flask, request
from flask_cors import cross_origin
import json

app = Flask("backend_server")

def init():
    print('init')

@app.route('/')
@cross_origin()
def index():
    return 'The backend server works!'

@app.route('/query')
@cross_origin()
def query():
    name = request.args.get('name')
    age = request.args.get('age')
    if age == None:
        age = 'Unknown'

    return '''
        <b>Name</b>: %(name)s<br>
        <b>Age</b>: %(age)s<br>
        ''' % {'name':name, 'age':age}

if __name__ == '__main__':
    init()
    app.run(host='0.0.0.0', port=19998, debug=True)
```
執行結果：
- `http://10.78.26.241:19998/query`
    ![](https://i.imgur.com/iuG1dOb.png)
- `http://10.78.26.241:19998/query?name=tj_tsai`
    ![](https://i.imgur.com/iImdKvB.png)
- `http://10.78.26.241:19998/query?name=tj_tsai&age=25`
    ![](https://i.imgur.com/6NVBg8U.png)

### 參考資料
- [How can I get the named parameters from a URL using Flask?](https://stackoverflow.com/questions/24892035/how-can-i-get-the-named-parameters-from-a-url-using-flask)

<br>

## 其他參考資料
- [靜態檔案](https://medium.com/seaniap/python-web-flask-%E4%BD%BF%E7%94%A8%E9%9D%9C%E6%85%8B%E6%AA%94%E6%A1%88-ac00e863a470)
- [How to get an IP address using Flask in Python](https://www.kite.com/python/answers/how-to-get-an-ip-address-using-flask-in-python)
    `flask.request.remote_addr`
    
<br>

# Javascript
## 後端相關
- ### [How to Use Fetch with async/await](https://dmitripavlutin.com/javascript-fetch-async-await/)