在这个项目中，不仅提供买家购买海外商品服务，还支持在海外的卖家发布商品，将一个小型的自由海外交易市场搬进手机。作为一个海外购物App，如何尽可能地保证卖家发布商品确实从海外购入，而非国内某工厂的仿冒品呢？这里就需要对发布商品的卖家做一个识别地理位置了。
.jpg)
1、定位识别：
进入发布页面，系统识别用户是否在海外，位置检测在国外或港澳台地区时，会跳转到发布页，并需要资质申请，通过即可发布；如果在内地，则跳出温馨提示，不能发布商品。使用uexLocation插件获取当前经纬度的地理位置信息，写isInChina方法将中国所在地区的经纬度包含进去，判断获得经纬度是否在isInChina内。
如果在内地：
uexLocation.openLocation(locLevel, distanceFilter);
uexLocation.onChange = function(latTemp, logTemp){
lat = latTemp;
log = logTemp;
var isinchina=isInChina(lat, log);
if(isinchina==true){
time++;
var country="中国";
countryCode="CN";
appcan.locStorage.setVal("country", country);
appcan.locStorage.setVal("countryCode", countryCode);
如果在国外或港澳台地区：
uexLocation.getAddress(lat, log, 1);
uexLocation.cbGetAddress = function(pCode, dataType, data){
if(data.indexOf('香港') != -1 || data.indexOf('Hong Kong') != -1||data.indexOf('澳门') != -1 || data.indexOf('Macao') != -1||data.indexOf('台湾') != -1 || data.indexOf('Taiwan') != -1) //判断是否为港澳台地区
调用谷歌地图接口：
appcan.request.ajax({
url :'https://www.google.com/maps/api/geocode/json?latlng='+lat+','+log+'&location_type=ROOFTOP&key=AIzaSyDg694kAk17qzDqzz9M3983lwmnT0OJyvk',
type : 'GET',
dataType : 'json',
success : function(data) {
console.log(JSON.stringify(data));
var array=[];
array=data.results[0].address_components;
array.forEach(function(e){
if(e.types[0]=="country")
{
var country=e.long_name;
if(!/^[\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\u4e00-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\u9fa5]+$/i.test(country)){
country=namelist[country];
}
countryCode=e.short_name;
appcan.locStorage.setVal("country", country);
appcan.locStorage.setVal("countryCode", countryCode);
}
if(e.types[0]=="route")
{
var street=e.long_name;
appcan.locStorage.setVal("street", street);
}
if(e.types[0]=="street_number")
{
var snumber=e.long_name;
appcan.locStorage.setVal("snumber", snumber);
}
})
location=data.results[0].formatted_address;
appcan.locStorage.setVal("location", location);
},
error : function(errMessage) {
//alert("errMessage:"+JSON.stringify(errMessage));
uexWindow.toast("0", "5", "网络信号差", "2000");
}
});
}
}
}
if(uexWidgetOne.platformName == "iOS"){
if(lat==0&&log==0){
countryCode="0";
appcan.locStorage.setVal("countryCode",countryCode);
}
}
}
点击发布按钮时
appcan.button("#publish", "btn-act", function() {
countryCode=appcan.locStorage.getVal("countryCode");
if(userId!=null){
//判断地理位置
appcan.request.ajax({
url :api+'/api/shoplive/checkQualification?deviceInfo='+deviceInfo+'&userId='+userId+'&countryCode='+countryCode,
type : 'GET',
dataType : 'json',
success : function(data) {
if(data.status==0){
//在国内跳出提示页，不能发布商品
appcan.locStorage.setVal("reminder", "1");
appcan.window.open("reminder","html/reminder.html",10);
}
if(data.status==1){
//在海外，判断是否通过资质申请
appcan.request.ajax({
url :api+'/api/user/me/'+userId,
type : 'GET',
dataType : 'json',
success : function(data) {
if(data.status==1){
//通过资质申请，判断是否设置支付宝收款账号
if(data.data.user.account) {
uexWindow.open("publish","0","publish.html","0","0","0","0","200");
}else{
uexWindow.toast("0", "5", "为了您的钱款安全，请先设置支付宝收款账号", "2000");
setTimeout(function() {
appcan.window.open("myalinum","html/myalinum.html",10);
}, 2000);
}
}if(data.status == 0){
uexWindow.toast("1","5",data.msg,-1);
}
},
error : function(errMessage) {
//alert("errMessage:"+JSON.stringify(errMessage));
}
});
}
//没有通过资质申请 ，跳转到资质申请页
if(data.status==2){
uexWindow.toast("0", "5", data.msg, "2000");
setTimeout(function() {
appcan.window.open("apply","html/apply.html",0);
}, 2000);
}
},
error : function(errMessage) {
//alert("errMessage:"+JSON.stringify(errMessage));
}
});
} else{
appcan.window.open("login","login.html",16);
}
})
2、上传图片可选拍照或从相册选取图片，调用到了uexImage和uexCamera插件，使用uexImage.openPicker方法打开照片选择器，uexCamera.open打开相机，说个题外话，uexCamera中可以用openViewCamera方法打开自定义View照相机，本项目中没有用到。
上传图片布局：
<div class="ub ub-ac" style="padding: .5em;line-height: 1.4em;">
<div id="scenepic">
<img src="image/choosePic.png" onclick="choose();" style="width: 6em;margin-top:.5em;margin-left:.5em; " />
</div>
<p class="ub ub-f1" style="margin:0 1em;font-size:.9em;">为确保真实性，请添加现场购物的店面照片</p>
</div>
拍照或从相册选取图片
function choosepic(){
var data = {
min:1,
max:1,
quality:0.5,
detailedInfo:false
}
var json = JSON.stringify(data);
uexImage.openPicker(json);
uexImage.onPickerClosed=function(info){
img_url = JSON.parse(info).data[0];
uploadimg();
}
}
function takephoto(){
if(uexWidgetOne.platformName == "iOS" || uexWidgetOne.platformName == "ios"){
uexCamera.cbOpen=function (opCode, dataType, data){
img_url=data;
uploadimg();
}
uexCamera.open(0,50);
}else{
uexCamera.cbOpenInternal=function (opCode, dataType, data){//仅android
img_url=data;
uploadimg();
}
uexCamera.openInternal(0,50);
}
}
调用后台接口上传图片，返回原图和缩略图：
function uploadimg() {
appcan.request.ajax({
url : api+'/api/util/uploadImage?type=2',
type : 'POST',
dataType : 'json',
data : {
image : {
path : img_url
}
},
success : function(data, status) {
if (data.status == 1) {
appcan.window.openToast('上传成功', 1500, 5, 0);
thumb=data.url[0];
image=data.url[1];
have_img=true;
appcan.locStorage.setVal("have_img",have_img);
appcan.locStorage.setVal("thumb",thumb);
appcan.locStorage.setVal("image",image);
var html='<img src="'+api+thumb+'" class="shoplive_image" style="width:6em;height:6em;margin: .5em 1em;" onclick="openimg();"/>';
$("#scenepic").html(html);
} else {
appcan.window.openToast('上传失败', 1500, 5, 0);
}
},
error : function(err) {
appcan.window.openToast('上传失败', 1500, 5, 0);
}
})
}
3、其他数据布局，代码如下：
<form method="POST" name="card" action>
<div class="ub ub-f1 ub-ver" style="background-color: #FFFFFF;padding: .8em 0;margin-bottom: .8em;height: 8em;">
<div class="ub uinput3" style="height: 6em;">
<textarea id="desc" placeholder="填写店面名称、品牌、优惠等"></textarea>
</div>
</div>
<div class="ub ub-ac" style="background-color: #FFFFFF;margin-bottom: .8em;">
<div class="ub ub-f1" style="padding:1em 1.5em;width:4em;">
活动时间
</div>
<div class="ub ub-ac ub-pc" style="color: #BCBCBC;">
<div class="ub ub-ac ub-pc uinput4" id="deadtime" style="width:12em;">
<input id="hour" name="T1" type="number" min="0" max="99" onkeyup="value=value.replace(/\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\D/g,'');return T1_onkeyup()"/>小时
<input id="minute" name="T2" type="number" onkeyup="if(event.keyCode !=37 && event.keyCode != 39){if (! /^[0-5]{0,1}[0-9]{1}$/ig.test(this.value)){this.value='';}}"/>分钟
</div>
</div>
</div>
<div class="ub ub-ac" style="background-color: #FFFFFF;margin-bottom: .8em;">
<div class="ub ub-f1" style="padding:1em 1.5em;width:4em;">
回国日期
</div>
<div class="ub ub-ac ub-pc" style="color: #BCBCBC;">
<div class="ub ub-ac ub-pc uinput1" id="backtime" style="width:10em;padding-right: .5em">
</div>
</div>
</div>
<div class="ub ub-ac" style="background-color: #FFFFFF;margin-bottom: .8em;">
<div class="ub ub-f1" style="padding:1em 1.5em;width:4em;">
所在位置
</div>
<div class="ub ub-ac ub-pc" style="color: #BCBCBC;">
<div class="ub ub-ac ub-pc" id="location" style="width:13em;padding-right: .5em">
</div>
</div>
</div>
</form>
4、调用后台接口创建淘现场，上传发布信息，这里使用appcan.locStorage.setVal设置一个值到本地存储，通过appcan.locStorage.remove 方法来清除localStorage中对应的值，js代码如下：
var uploadHttp=api + '/api/shoplive/add?userId='+userId+'&desc='
+desc+'&endTime='+h+'-'+ms+'&backTime='+backdate+'&latlng='
+lat+','+log+'&location_info='+locationInfo+'&country='+country+'&area='+area+'&image='+image+'&thumb='+thumb;
appcan.request.ajax({
url :encodeURI(uploadHttp),
type : 'get',
dataType : 'json',
success : function(data, status) {
if (data.status == 1) {
appcan.window.openToast('创建成功', 1500, 5, 0);
var shoplive_id=data.id;
appcan.locStorage.setVal("shoplive_id",shoplive_id);
appcan.window.open('share2', 'html/share2.html', 10);
uexWindow.evaluatePopoverScript("", "content", "remove()");
appcan.locStorage.remove("desc");
appcan.locStorage.remove("hour");
appcan.locStorage.remove("minute");
appcan.locStorage.remove("backdate");
appcan.locStorage.remove("have_img");
appcan.locStorage.remove("thumb");
appcan.locStorage.remove("image");
} else {
appcan.window.openToast('创建失败', 1500, 5, 0);
}
},
error : function(err) {
//appcan.window.openToast('创建失败', 1500, 5, 0);
uexWindow.toast("0", "5", "网络信号差", "2000");
}
})
400-040-1766
服务邮箱：service@zymobi.com