制作手机静态页面
2016-05-03 10:13
274 查看
1.引入库(百度cdn):
引入bootstrap <link href="http://apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap-theme.css" rel="stylesheet" type="text/css">
引入jquery <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
2.手机适应屏幕：
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1, maximum-scale=1, user-scalable=no" />
<html style="height: 100%; width: 100%">
body {
margin:0px;
height: 100%;
width: 100%
}
3.大小， 间隔距离用百分比：
.main_background .user_field{
margin-left:auto;
margin-right:auto;
text-align:left;
width:100%;
height: 10%;
font-family:"幼圆";
text-align: center;
}
.first_div .photo_field div{
width: 100%;
height: 100%;
}
.first_div .photo_field div img{
width: 30%;
height: 60%;
float:left;
margin-left: 2.5%;
}
4.背景图片:
.background_div{
background: url(http://cdn.a0.bnbtrip.com/assets/images/web/2016/04/main_background.jpg) no-repeat;
cursor: pointer;
border: none;
width: 100%;
height: 70%;
background-size: cover;
background-position:center;
}
.box_2{
position:absolute;
width: 300px;
left:50%;
height:250px;
background: url(http://cdn.a0.bnbtrip.com/assets/images/web/2016/04/smile.png) no-repeat;
background-size: cover;
background-position:center;
}
5.手机发送验证短信（ajax）：
点领取按钮领取验证码（ajax），向send_code（action）API发送data数据， 即send_code动作内所要用到的params的数据， ajax请求服务器返回类型是dataType:'json'时， 则返回render json: json_response('time limit error', 400, [flash[:error]]) and return， 通过 success:function(data)回调函数的data接受send_code的返回值, 来判断返回状态， 可以在action中判断不同情况来返回不同status的状态来表示是否由错误（比如返回status:401则表示用户名已注册）
tourism_activity.html.erb中：
<div class="user_field">
<label>手 机 :</label>
<input id="first_input" type="text" required="true"/> <button class="button" id="button">领验证码</button>
</div>
$(".button").click(function(){
var phone = $("#first_input").val();
var reg = /^1[3458]\d{9}$/;
if (!reg.test(phone)){
layer("手机号格式不符");
return;
}
$.ajax({
dataType:'json',
type: 'post',
url: '/users/send_code',
cache: false,
data:{
phone: phone,
platform: 'web'
},
success:function(data){
time($(".button"));
if (data.meta.status == 400){
layer("该用户名已注册");
return;
}
}
});
});
user_controller.rb中的send_code（发送短信的按钮（ajax）即向该controller中的action（send_code）发送请求）：
def send_code
phone = params[:phone]
country_code = params[:country_code] || "+86"
if params[:platform] != "web"
unless RequestSign.check_sign(params, "register_code")
flash[:error] = "args_and_sign_error"
render json: json_response('args error', 500, [flash[:error]]) and return
end
end
if Authentication.phone_register?(phone, country_code)
flash[:error] = I18n.t("error.tips.phone_is_already_register")
render json: json_response(I18n.t("error.tips.phone_is_already_register"), 400, [flash[:error]]) and return
end
verification = Verification.find_by(category: "phone", body: phone, country_code: country_code)
if verification.present?
unless verification.phone_code!
flash[:error] = "time_limit_error"
render json: json_response('time limit error', 400, [flash[:error]]) and return
end
else
verification = Verification.create(category: "phone", body: phone, phone_code_at: Time.now, phone_code: rand(1000..9999), country_code: country_code)
end
set_locale_by_country_code(country_code)
message = I18n.t "message.user.send_register_code", code: verification.phone_code
if message_id = BnbSms.send_to(phone, message, country_code)
verification.update(message_id: message_id)
render json: {meta: {status: 200}, data: {}}, status: 200
else
flash[:error] = I18n.t("error.tips.send_code_failed")
render json: json_response(I18n.t("error.tips.send_code_failed"), 401, [flash[:error]])
end
end
点击按钮发送短信后进行按钮的置灰和60秒倒计时， 即time函数在按钮的click事件后success:function回调函数中进行调用（jquery）:
var wait=60;
function time(o) {
if (wait == 0) {
o.removeAttr("disabled").css("background-color","#ff5468");
o.text("获取验证码");
wait = 60;
} else {
o.attr("disabled", true).css("background-color","#888888");
o.text(wait + "秒重发");
wait--;
setTimeout(function() {
time(o);
}
4000
,
1000)
}
}
$(".button").click(function(){
var phone = $("#first_input").val();
var reg = /^1[3458]\d{9}$/;
if (!reg.test(phone)){
layer("手机号格式不符");
return;
}
$.ajax({
type: 'post',
url: '/users/send_code',
cache: false,
data:{
phone: phone,
platform: 'web'
},
success:function(data){
time($(".button"));
if (data.meta.status == 400){
layer("该用户名已注册");
return;
}
}
});
});
6.如果手机验证码核对正确， 且密码手机号的格式都正确则进行用户注册， 相当于ajax向user_controller.rb中的create动作发送请求传递data即create中params的参数， 请求返回dataType: 'json', 通过create中的render :json来返回数据进行判断， 但本例中是将user_controller.rb中的create代码复制到了static_pages.rb中photo_registered动作中因为只做手机web所以要精简一些代码：
tourism_activity.html.erb中：
<div class="user_field" id="post_field">
<button class="post_botton">一键领取大礼包</button>
</div>
$(".post_botton").click(function(){
var phone = $("#first_input").val();
var code = $("#second_input").val();
var password = $("#third_input").val();
var reg = /^1[3458]\d{9}$/;
if (password.length < 6)
{
layer("密码少于6位");
return;
}
if (!reg.test(phone)){
layer("手机号格式不符");
return;
}
$.ajax({
type: 'post',
url: '/static_pages/photo_registered',
cache: false,
dataType:'json',
data:{
user: {phone: phone, password: password},
code: code,
register_type: "phone"
},
success:function(data){
var phone = $("#first_input").val();
if (data.meta.status == 400){
layer("该用户名已注册");
return;
}
if (data.meta.status == 401){
layer(data.errors);
return;
}
if (data.meta.status == 406){
layer("该用户名已注册");
return;
}
if (data.meta.status == 402){
layer("该用户名已注册");
return;
}
if (data.meta.status == 200){
layer_2(phone);
return;
}
}
});
});
static_pages_controller.rb中：
def photo_registered
@meta_description = '趣住啊旅游月HIGH翻天'
if params[:register_type] == "phone"
country_code = params[:country_code] || "+86"
phone = params[:user][:phone]
verification = Verification.find_by(body: phone, country_code: country_code)
if Authentication.phone_register?(phone)
render json: json_response("phone_already_register_error", 406, ["errors"]) and return
end
if User.find_by_phone(params[:user][:phone]).present?
render json: json_response("phone_already_register_error", 406, ["errors"]) and return
end
if Authentication.find_by(uid: phone, provider: "phone", country_code: country_code).present?
flash[:error] = I18n.t("error.tips.already_register_error")
render json: json_response(I18n.t("error.tips.already_register_error"), 400, [flash[:error]]) and return
end
if verification && verification.check_code(params[:code], :phone_code, country_code)
@user = User.create(phone_params)
if @user.save
@user.authentications.create(provider: "phone", uid: phone, country_code: country_code)
verification.update(user_id: @user.id)
@user.check_invitation!
end
else
flash[:error] = I18n.t("error.tips.phone_code_error")
render json: json_response(I18n.t("error.tips.phone_code_error"), 401, [flash[:error]]) and return
end
elsif params[:register_type] == "email"
email = params[:user][:email]
auth = Authentication.find_by(provider: "email", uid: email)
# if email is used by other people #TODO
if auth.present?
flash[:error] = I18n.t("error.tips.email_had_already_registed")
render json: json_response(I18n.t("error.tips.email_had_already_registed"), 403, [flash[:error]])
return
end
@user = User.new(user_params)
end
@user.first_name = '_'
@user.last_name = '_'
if @user.save!
auto_login(@user)
@user.user_coupons.create(coupon_id: 2)
# when register from app
if params[:platform].present?
@user.check_marketing_user
@authentication_token = @user.make_token(token_params)
end
if params[:register_type] == "email"
@user.email = params[:user][:email]
end
respond_to do |format|
format.html { render nothing:true }
format.json { render json: json_response('ok', 200) }
end
else
respond_to do |format|
format.html { render nothing: true }
format.json { render json_error('signup error', 402, @user.errors.messages.to_a.map {|t| t[0].to_s + ': ' + t[1].join(', ')}) }
end
end
end
7.微信中的分享（js）网上可以查到（即微信分享的js代码）：
相关介绍网页地址：
https://open.weixin.qq.com/
a.在head中引入该js文件
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
b.在js代码中加入,description的值@meta_description是在action中定义的（ var description = "<%= @meta_description %>";）:
window.weixin_data = <%= raw BnbWeixin.get_sign(request.url).to_json %>;
var share_logo_url = 'http://cdn.a0.bnbtrip.com/assets/images/web/app-logo%403x.png';
var title = document.title;
var description = "<%= @meta_description %>";
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: weixin_data.appId, // 必填，公众号的唯一标识
timestamp: weixin_data.timestamp, // 必填，生成签名的时间戳
nonceStr: weixin_data.noncestr, // 必填，生成签名的随机串
signature: weixin_data.signature,// 必填，签名，见附录1
jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ", "onMenuShareWeibo", "onMenuShareQZone"] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
});
wx.ready(function () {
wx.onMenuShareTimeline({
title: title, // 分享标题
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareAppMessage({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
type: 'link', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareQQ({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareWeibo({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareQZone({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
});
wx.error(function (res) {
console.log("wx error:" + res.errMsg);
});
8.使用Google Analytics跟踪捕获js， angularjs， jquery在线错误和异常（也可以探测网页的实时点击量等）
使用参考文章地址：
http://www.google.cn/intl/zh-CN_ALL/analytics/index.html http://jingyan.baidu.com/article/359911f572d91957fe03062d.html http://ourjs.com/detail/54f6b500232227083e00003c?utm_source=tuicool&utm_medium=referral
本例中是在tourism_activity.html.erb中<body>标签内的底部（注意是<body>标签内, 的底部）来检测点击量等.
<% if Rails.env.production? %>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-70873760-1', 'auto');
ga('send', 'pageview');
</script>
<% end %>
</body>
9.图片链接：
<a href="http://www.bnbtrip.com/rooms/661941177"><img src="http://cdn.a0.bnbtrip.com/assets/images/web/2016/04/art_left.jpg"></a>
10.手机看本地页面：
a.启动本地rails s服务， 并监听所有IP地址（0.0.0.0-255.255.255.255）
rails s -b 0.0.0.0
b.用手机和电脑在一个局域网， ifconfig查本机ip地址， 然后手机网址中输入ip:3000/sss/sss
也就是电脑的ip地址+端口号3000+url路径（http://localhost:3000/manage/rooms如果是这个则url路径就是/manage/rooms， 这里http://localhost相当于127.0.0.1也就是本地回环， 手机上电脑的web服务相当于访问电脑的IP地址也就是：ip:3000/sss/sss）
引入bootstrap <link href="http://apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap-theme.css" rel="stylesheet" type="text/css">
引入jquery <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
2.手机适应屏幕：
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1, maximum-scale=1, user-scalable=no" />
<html style="height: 100%; width: 100%">
body {
margin:0px;
height: 100%;
width: 100%
}
3.大小， 间隔距离用百分比：
.main_background .user_field{
margin-left:auto;
margin-right:auto;
text-align:left;
width:100%;
height: 10%;
font-family:"幼圆";
text-align: center;
}
.first_div .photo_field div{
width: 100%;
height: 100%;
}
.first_div .photo_field div img{
width: 30%;
height: 60%;
float:left;
margin-left: 2.5%;
}
4.背景图片:
.background_div{
background: url(http://cdn.a0.bnbtrip.com/assets/images/web/2016/04/main_background.jpg) no-repeat;
cursor: pointer;
border: none;
width: 100%;
height: 70%;
background-size: cover;
background-position:center;
}
.box_2{
position:absolute;
width: 300px;
left:50%;
height:250px;
background: url(http://cdn.a0.bnbtrip.com/assets/images/web/2016/04/smile.png) no-repeat;
background-size: cover;
background-position:center;
}
5.手机发送验证短信（ajax）：
点领取按钮领取验证码（ajax），向send_code（action）API发送data数据， 即send_code动作内所要用到的params的数据， ajax请求服务器返回类型是dataType:'json'时， 则返回render json: json_response('time limit error', 400, [flash[:error]]) and return， 通过 success:function(data)回调函数的data接受send_code的返回值, 来判断返回状态， 可以在action中判断不同情况来返回不同status的状态来表示是否由错误（比如返回status:401则表示用户名已注册）
tourism_activity.html.erb中：
<div class="user_field">
<label>手 机 :</label>
<input id="first_input" type="text" required="true"/> <button class="button" id="button">领验证码</button>
</div>
$(".button").click(function(){
var phone = $("#first_input").val();
var reg = /^1[3458]\d{9}$/;
if (!reg.test(phone)){
layer("手机号格式不符");
return;
}
$.ajax({
dataType:'json',
type: 'post',
url: '/users/send_code',
cache: false,
data:{
phone: phone,
platform: 'web'
},
success:function(data){
time($(".button"));
if (data.meta.status == 400){
layer("该用户名已注册");
return;
}
}
});
});
user_controller.rb中的send_code（发送短信的按钮（ajax）即向该controller中的action（send_code）发送请求）：
def send_code
phone = params[:phone]
country_code = params[:country_code] || "+86"
if params[:platform] != "web"
unless RequestSign.check_sign(params, "register_code")
flash[:error] = "args_and_sign_error"
render json: json_response('args error', 500, [flash[:error]]) and return
end
end
if Authentication.phone_register?(phone, country_code)
flash[:error] = I18n.t("error.tips.phone_is_already_register")
render json: json_response(I18n.t("error.tips.phone_is_already_register"), 400, [flash[:error]]) and return
end
verification = Verification.find_by(category: "phone", body: phone, country_code: country_code)
if verification.present?
unless verification.phone_code!
flash[:error] = "time_limit_error"
render json: json_response('time limit error', 400, [flash[:error]]) and return
end
else
verification = Verification.create(category: "phone", body: phone, phone_code_at: Time.now, phone_code: rand(1000..9999), country_code: country_code)
end
set_locale_by_country_code(country_code)
message = I18n.t "message.user.send_register_code", code: verification.phone_code
if message_id = BnbSms.send_to(phone, message, country_code)
verification.update(message_id: message_id)
render json: {meta: {status: 200}, data: {}}, status: 200
else
flash[:error] = I18n.t("error.tips.send_code_failed")
render json: json_response(I18n.t("error.tips.send_code_failed"), 401, [flash[:error]])
end
end
点击按钮发送短信后进行按钮的置灰和60秒倒计时， 即time函数在按钮的click事件后success:function回调函数中进行调用（jquery）:
var wait=60;
function time(o) {
if (wait == 0) {
o.removeAttr("disabled").css("background-color","#ff5468");
o.text("获取验证码");
wait = 60;
} else {
o.attr("disabled", true).css("background-color","#888888");
o.text(wait + "秒重发");
wait--;
setTimeout(function() {
time(o);
}
4000
,
1000)
}
}
$(".button").click(function(){
var phone = $("#first_input").val();
var reg = /^1[3458]\d{9}$/;
if (!reg.test(phone)){
layer("手机号格式不符");
return;
}
$.ajax({
type: 'post',
url: '/users/send_code',
cache: false,
data:{
phone: phone,
platform: 'web'
},
success:function(data){
time($(".button"));
if (data.meta.status == 400){
layer("该用户名已注册");
return;
}
}
});
});
6.如果手机验证码核对正确， 且密码手机号的格式都正确则进行用户注册， 相当于ajax向user_controller.rb中的create动作发送请求传递data即create中params的参数， 请求返回dataType: 'json', 通过create中的render :json来返回数据进行判断， 但本例中是将user_controller.rb中的create代码复制到了static_pages.rb中photo_registered动作中因为只做手机web所以要精简一些代码：
tourism_activity.html.erb中：
<div class="user_field" id="post_field">
<button class="post_botton">一键领取大礼包</button>
</div>
$(".post_botton").click(function(){
var phone = $("#first_input").val();
var code = $("#second_input").val();
var password = $("#third_input").val();
var reg = /^1[3458]\d{9}$/;
if (password.length < 6)
{
layer("密码少于6位");
return;
}
if (!reg.test(phone)){
layer("手机号格式不符");
return;
}
$.ajax({
type: 'post',
url: '/static_pages/photo_registered',
cache: false,
dataType:'json',
data:{
user: {phone: phone, password: password},
code: code,
register_type: "phone"
},
success:function(data){
var phone = $("#first_input").val();
if (data.meta.status == 400){
layer("该用户名已注册");
return;
}
if (data.meta.status == 401){
layer(data.errors);
return;
}
if (data.meta.status == 406){
layer("该用户名已注册");
return;
}
if (data.meta.status == 402){
layer("该用户名已注册");
return;
}
if (data.meta.status == 200){
layer_2(phone);
return;
}
}
});
});
static_pages_controller.rb中：
def photo_registered
@meta_description = '趣住啊旅游月HIGH翻天'
if params[:register_type] == "phone"
country_code = params[:country_code] || "+86"
phone = params[:user][:phone]
verification = Verification.find_by(body: phone, country_code: country_code)
if Authentication.phone_register?(phone)
render json: json_response("phone_already_register_error", 406, ["errors"]) and return
end
if User.find_by_phone(params[:user][:phone]).present?
render json: json_response("phone_already_register_error", 406, ["errors"]) and return
end
if Authentication.find_by(uid: phone, provider: "phone", country_code: country_code).present?
flash[:error] = I18n.t("error.tips.already_register_error")
render json: json_response(I18n.t("error.tips.already_register_error"), 400, [flash[:error]]) and return
end
if verification && verification.check_code(params[:code], :phone_code, country_code)
@user = User.create(phone_params)
if @user.save
@user.authentications.create(provider: "phone", uid: phone, country_code: country_code)
verification.update(user_id: @user.id)
@user.check_invitation!
end
else
flash[:error] = I18n.t("error.tips.phone_code_error")
render json: json_response(I18n.t("error.tips.phone_code_error"), 401, [flash[:error]]) and return
end
elsif params[:register_type] == "email"
email = params[:user][:email]
auth = Authentication.find_by(provider: "email", uid: email)
# if email is used by other people #TODO
if auth.present?
flash[:error] = I18n.t("error.tips.email_had_already_registed")
render json: json_response(I18n.t("error.tips.email_had_already_registed"), 403, [flash[:error]])
return
end
@user = User.new(user_params)
end
@user.first_name = '_'
@user.last_name = '_'
if @user.save!
auto_login(@user)
@user.user_coupons.create(coupon_id: 2)
# when register from app
if params[:platform].present?
@user.check_marketing_user
@authentication_token = @user.make_token(token_params)
end
if params[:register_type] == "email"
@user.email = params[:user][:email]
end
respond_to do |format|
format.html { render nothing:true }
format.json { render json: json_response('ok', 200) }
end
else
respond_to do |format|
format.html { render nothing: true }
format.json { render json_error('signup error', 402, @user.errors.messages.to_a.map {|t| t[0].to_s + ': ' + t[1].join(', ')}) }
end
end
end
7.微信中的分享（js）网上可以查到（即微信分享的js代码）：
相关介绍网页地址：
https://open.weixin.qq.com/
a.在head中引入该js文件
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
b.在js代码中加入,description的值@meta_description是在action中定义的（ var description = "<%= @meta_description %>";）:
window.weixin_data = <%= raw BnbWeixin.get_sign(request.url).to_json %>;
var share_logo_url = 'http://cdn.a0.bnbtrip.com/assets/images/web/app-logo%403x.png';
var title = document.title;
var description = "<%= @meta_description %>";
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: weixin_data.appId, // 必填，公众号的唯一标识
timestamp: weixin_data.timestamp, // 必填，生成签名的时间戳
nonceStr: weixin_data.noncestr, // 必填，生成签名的随机串
signature: weixin_data.signature,// 必填，签名，见附录1
jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ", "onMenuShareWeibo", "onMenuShareQZone"] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
});
wx.ready(function () {
wx.onMenuShareTimeline({
title: title, // 分享标题
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareAppMessage({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
type: 'link', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareQQ({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareWeibo({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareQZone({
title: title, // 分享标题
desc: description, // 分享描述
link: window.location.href, // 分享链接
imgUrl: share_logo_url, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
});
wx.error(function (res) {
console.log("wx error:" + res.errMsg);
});
8.使用Google Analytics跟踪捕获js， angularjs， jquery在线错误和异常（也可以探测网页的实时点击量等）
使用参考文章地址：
http://www.google.cn/intl/zh-CN_ALL/analytics/index.html http://jingyan.baidu.com/article/359911f572d91957fe03062d.html http://ourjs.com/detail/54f6b500232227083e00003c?utm_source=tuicool&utm_medium=referral
本例中是在tourism_activity.html.erb中<body>标签内的底部（注意是<body>标签内, 的底部）来检测点击量等.
<% if Rails.env.production? %>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-70873760-1', 'auto');
ga('send', 'pageview');
</script>
<% end %>
</body>
9.图片链接：
<a href="http://www.bnbtrip.com/rooms/661941177"><img src="http://cdn.a0.bnbtrip.com/assets/images/web/2016/04/art_left.jpg"></a>
10.手机看本地页面：
a.启动本地rails s服务， 并监听所有IP地址（0.0.0.0-255.255.255.255）
rails s -b 0.0.0.0
b.用手机和电脑在一个局域网， ifconfig查本机ip地址， 然后手机网址中输入ip:3000/sss/sss
也就是电脑的ip地址+端口号3000+url路径（http://localhost:3000/manage/rooms如果是这个则url路径就是/manage/rooms， 这里http://localhost相当于127.0.0.1也就是本地回环， 手机上电脑的web服务相当于访问电脑的IP地址也就是：ip:3000/sss/sss）
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 简单的Android RecyclerView 使用小Demo
- C#之 十九 使用WinForm控件
- C#之 十九 使用WinForm控件
- 攻击状态
- android的消息处理机制（图+源码分析）——Looper,Handler,Message
- C#之 十九 使用WinForm控件
- 使用Python操作Evernote API
- 2015年总结
- AjaxHelper简介
- swift闭包-备
- GlobalSign 域名型 SSL 证书
- 聚焦B20，看2016年互联网行业大势
- 面试杂谈
- （Hibernate进阶）Hibernate搭建开发环境+简单实例（二）
- iOS自带AVPlayer视频播放器
- 用photoshop制作一张龙年邮票
- 父类、静态构造代码块、构造代码块、构造函数
- maven项目结构及生命周期
- Yii2 输出xml格式数据的方法
- 把数组排成最小的数