基于有道翻译的英翻中微信小程序
环境
微信开发者工具
微信小程序云开发
node.js v12.16.3
axios@0.20.0
cheerio@1.0.0-rc.3
相关内容
Node.js有道翻译爬虫
客户端
创建新的微信小程序项目,创建时选择不使用小程序云开发,进入项目后自行编写云函数,并修改下列文件
project.config.json
project.config.json
其中 "cloudfunctionRoot" : "cloud/"
用于设置云函数根目录,cloud/
可以修改为任意目录名
修改<appid>
{
"description": "项目配置文件",
"cloudfunctionRoot": "cloud/",
"packOptions": {
"ignore": []
},
"setting": {
"urlCheck": true,
"es6": true,
"postcss": true,
"preloadBackgroundData": false,
"minified": true,
"newFeature": true,
"coverView": true,
"nodeModules": false,
"autoAudits": false,
"showShadowRootInWxmlPanel": true,
"scopeDataCheck": false,
"checkInvalidKey": true,
"checkSiteMap": true,
"uploadWithSourceMap": true,
"babelSetting": {
"ignore": [],
"disablePlugins": [],
"outputPath": ""
},
"useCompilerModule": true,
"userConfirmedUseCompilerModuleSwitch": false
},
"compileType": "miniprogram",
"libVersion": "2.13.0",
"appid": "<appid>",
"projectname": "spider",
"debugOptions": {
"hidedInDevtools": []
},
"isGameTourist": false,
"simulatorType": "wechat",
"simulatorPluginLibVersion": {},
"cloudfunctionTemplateRoot": "cloudfunctionTemplate",
"condition": {
"search": {
"current": -1,
"list": []
},
"conversation": {
"current": -1,
"list": []
},
"game": {
"currentL": -1,
"list": []
},
"miniprogram": {
"current": -1,
"list": []
}
}
}
App.js
app.js
修改下述代码中的<环境ID>
App({
onLaunch: function () {
wx.cloud.init({
env: "<环境ID>",
});
},
globalData: {
userInfo: null
}
})
index.wxml
pages\index\index.wxml
<view class="container">
<view class="userinfo">
<button bindtap="translate">翻译</button>
</view>
<view class="usermotto">
<input placeholder="Word" bindinput="getWord"></input>
</view>
<view class="usermotto">
<text class="user-motto">{{motto}}</text>
</view>
</view>
index.js
pages\index\index.js
const app = getApp()
Page({
data: {
motto: '释义',
word : ''
},
onLoad: function () {
},
translate: function(e) {
var that = this;
wx.cloud.callFunction({
name: "translator",
data: {
word : that.data.word
},
success: (res) => {
console.log(res.result["meaning"]);
that.setData({
motto : res.result["meaning"]
});
},
fail: (res) => {
console.log("fail", res);
}
});
console.log(this.data.word);
},
getWord: function(e) {
this.setData({
word : e.detail.value
});
}
})
云函数
创建云函数
右击云函数根目录,点击新建Node.js云函数
,输入translator
保存,右击新建的Node.js
云函数目录translator
,点击在终端打开
,输入npm install axios cheerio
,进行npm
安装
npm安装
npm install axios cheerio
index.js
基于有道翻译和爬虫技术获取英文的中文释义,将结果返回给小程序
爬虫获取英文的中文释义可以参考Node.js有道翻译爬虫
cloud\translator\index.js
const cloud = require('wx-server-sdk')
cloud.init()
exports.main = async (event, context) => {
const cheerio = require("cheerio");
const axios = require("axios");
var str = null;
try {
const a = await axios.get(`http://www.youdao.com/w/eng/${event.word}`).then((response) => {
let $ = cheerio.load(response.data);
$(".results-content").each((index, element) => {
str = String($(".trans-container").children().first().text()).replace(' ', '').replace('\n', '')
console.log(str);
});
});
} catch(err) {
console.log(err);
}
return {meaning : str};
}
云函数部署
右击Node.js
云函数目录,点击上传并部署:所有文件
,等待更新云函数translator的云调用权限
和上传云函数translator
提示出现后上传成功
编译
点击上方的编译或快捷键Ctrl+S,编译小程序客户端
编译结果
左侧的模拟器可以看到
测试结果
最后
- 由于博主水平有限,不免有疏漏之处,欢迎读者随时批评指正,以免造成不必要的误解!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)