基于Serverless 搭建网址缩短页面

基于Serverless+python,使用 http://suo.im 的缩短网址的API,前端部署在cos上

使用方法

安装Serverless Framework
```
npm install -g serverless
```
下载项目

从 https://gitee.com/yu-se/short-link.git 下载源码包或者执行git clone
```
git clone [email protected]:yu-se/short-link.git
```
部署资源

执行serverless --debug部署资源,部署成功后记录serverless的地址
修改请求地址

修改web/index.html中的请求地址为serverless的地址,修改图中选中部分即可
重新部署资源

重新执行serverless --debug部署资源
访问

myWebsite的链接即可
修改KEY(可选)

登录 http://suo.im/ ,用户后台>短网址 > API接口,复制key,替换code/index.py中的key

开发

用于使用 http://suo.im 的API,而scf的python的环境中有requests,因此使用requests请求api

import requests
from urllib import parse

api = 'http://suo.im/api.htm'
key = '5e51fa20b1b63c4fd98eaa4a@6599fbb9164b4bc7eb440746c0c1a1fc'

def main_handler(event, context):
    print(event)
    url = event['queryString']['url']
    print(url)
    if url == None:
        return {'code':400,'info':'url is none'}
    
    res = requests.get(api+'?key='+key+'&url='+parse.quote(url))
    print(res.text)
    return {'code':200,'url':res.text}

将url使用urlencode编码,防止url中带&将参数截断

对于云函数的本地调试,使用anycodes大佬提到的方法,增加APIGW触发器的调试代码,是云函数可在本地运行.

if __name__ == "__main__":
    event = {}
    print(main_handler(event,None))

其中event为APIGW的事件模板,在云函数的详情页,依次点击函数代码>事件模板>新建模板> Api 模板然后复制即可,根据需要修改

前端使用vue+element+axios,采用cdn的方式引入

前端请求时要将url中的&替换为urlencode编码后的字符%26,同样为了防止url中的参数被截断.

serverless使用两个组件分别是@serverless/tencent-scf和@serverless/tencent-website

@serverless/tencent-scf部署后端接口,使用apigw

@serverless/tencent-website将前端上传到cos

以下为serverless.yml中的配置

shortLink:
  component: '@serverless/tencent-scf'
  inputs:
    name: shortLink
    enableRoleAuth: ture
    codeUri: ./code
    handler: index.main_handler
    runtime: Python3.6
    region: ap-guangzhou
    description: My Serverless Function
    memorySize: 64
    timeout: 20
    events:
      - apigw:
          name: serverless
          parameters:
            protocols:
              - http
            serviceName: serverless
            description: the serverless service
            environment: release
            endpoints:
              - path: /
                method: GET
                description: Serverless REST API
                enableCORS: TRUE
                serviceTimeout: 10

myWebsite:
  component: '@serverless/tencent-website'
  inputs:
    code:
      src: ./web
      index: index.html
      error: index.html
    region: ap-guangzhou
    bucketName: short-link

项目地址

https://gitee.com/yu-se/short-link