Stripe - 支付宝支付(前端)

2、前端代码:

use \Illuminate\Support\Facades\Input;

?>

   

   

   

   

    VIP会员</p> <p>    <link rel="stylesheet" type="text/css" href="<?=Config::get('app.cdn01')?>/api_assert/css/index.min.css"></p> <p>    <link rel="stylesheet" type="text/css" href="<?=Config::get('app.cdn01')?>/api_assert/css/inviteReg.min.css"></p> <p>    <script src="<?=Config::get('app.cdn01')?>/api_assert/script/flexible.min.js"></p> <p>        #footers{</p> <p>width:100%;</p> <p>            height:6rem;</p> <p>            background:#fff;</p> <p>            position:fixed;</p> <p>            left:0;</p> <p>            bottom: -.2rem;</p> <p>            margin:auto;</p> <p>        }</p> <p>.footers_top{</p> <p>width:100%;</p> <p>            height:.9rem;</p> <p>            text-align:center;</p> <p>            line-height:.9rem;</p> <p>            background:#fff;</p> <p>            position:relative;</p> <p>            display:flex;</p> <p>            justify-content:center;</p> <p>            align-items:center;</p> <p>        }</p> <p>.footers_top span{</p> <p>font-family:"PingFang-SC-Regular";</p> <p>            font-size:.34rem;</p> <p>            color:#333333;</p> <p>        }</p> <p>.footers_top .no_icon{</p> <p>width:.22rem;</p> <p>            height:.22rem;</p> <p>            position:absolute;</p> <p>            right:.3rem;</p> <p>            top:0;</p> <p>            bottom:0;</p> <p>            margin:auto;</p> <p>        }</p> <p>.footers_top .no_icon img{</p> <p>display:block;</p> <p>            width:100%;</p> <p>        }</p> <p>.mark fade{</p> <p>width:100%;</p> <p>            height:100%;</p> <p>        }</p> <p>.Popup {</p> <p>display:none;</p> <p>            width:100%;</p> <p>            height:6rem;</p> <p>            background:#fff;</p> <p>            position:fixed;</p> <p>            left:0;</p> <p>            right:0;</p> <p>            bottom:0;</p> <p>            margin:auto;</p> <p>            z-index:999;</p> <p>            padding:.9rem .3rem 0rem;</p> <p>            box-sizing:border-box;</p> <p>        }</p> <p>.Popup .footers_top{</p> <p>position:absolute;</p> <p>            top:0;</p> <p>            left:0;</p> <p>            margin:auto;</p> <p>            border-bottom:1px solid #e3e3e3;</p> <p>            background:#fff;</p> <p>        }</p> <p>.Popup .footers_top .no_icon{</p> <p>right:.3rem;</p> <p>        }</p> <p>.Popup .StripeElement {</p> <p>background-color:white;</p> <p>            height:40px;</p> <p>            padding:10px 12px;</p> <p>            border-radius:4px;</p> <p>            border:1px solid transparent;</p> <p>            box-shadow:0 1px 3px 0 #e6ebf1;</p> <p>            -webkit-transition:box-shadow 150ms ease;</p> <p>            transition:box-shadow 150ms ease;</p> <p>        }</p> <p>.Popup .StripeElement--focus {</p> <p>box-shadow:0 1px 3px 0 #cfd7df;</p> <p>        }</p> <p>.Popup .StripeElement--invalid {</p> <p>border-color:#fa755a;</p> <p>        }</p> <p>.Popup .StripeElement--webkit-autofill {</p> <p>background-color:#fefde5 !important;</p> <p>        }</p> <p>.Popup .StripeElement {</p> <p>background-color:white;</p> <p>            height:40px;</p> <p>            padding:10px 12px;</p> <p>            border-radius:4px;</p> <p>            border:1px solid transparent;</p> <p>            box-shadow:0px 0px 3px 1px #e6ebf1;</p> <p>            -webkit-transition:box-shadow 150ms ease;</p> <p>            transition:box-shadow 150ms ease;</p> <p>        }</p> <p><body class="unheader unfooter"></p> <p><div class="header"></p> <p>    <div class="header-btn"></p> <p>        <div class="i-arrow" _back></p> <p>        <div class="i-close" _close></p> <p>    <div class="header-title">邀请注册</p> <p><div class="main" id="btn" data-message="<?=isset($ban_flag)?$ban_flag:''?>"></p> <p>    <div class="step"></p> <p>        <div>1.选择礼包</p> <p>        <div><div class="i-arrow"></p> <p>        <div>2.收货信息</p> <p>        <div><div class="i-arrow"></p> <p>        <div class="on">3.立即支付</p> <p>    <form class="step3" action="payment/create"></p> <p>        <div class="scroll"></p> <p>                <label class="input-group"></p> <p>                    <div class="group"></p> <p>                        <div class="group-l nowrap"></p> <p>                            <button type="button" class="name">邀请人 </p> <p>                        <div class="group-r"></p> <p>                            <div class="contant"><?php echo $parent->nick_name?></p> <p>                    $inviteCode = \App\Models\UserInviteCode::query()->where('user_id',$parent->user_id)->where('state',1)->first();</p> <p>                ?>                <label class="input-group" <?php echo $inviteCode?'':'style="display:none"'?>></p> <p>                    <div class="group"></p> <p>                        <div class="group-l nowrap"></p> <p>                            <button type="button" class="name">邀请码 </p> <p>                        <div class="group-r"></p> <p>                            <div class="contant"></p> <p>                                <?php echo $inviteCode?$inviteCode->code:'';  ?>                           </p> <p>                <label class="input-group"></p> <p>                    <div class="group"></p> <p>                        <div class="group-l nowrap"></p> <p>                            <button type="button" class="name">联系人 </p> <p>                        <div class="group-r"></p> <p>                            <div class="contant"></p> <p>                                <?php echo e(Input::get('name'))?>  <?php echo e(Input::get('phone'))?>                           </p> <p>                <label class="input-group"></p> <p>                    <div class="group top"></p> <p>                        <div class="group-l nowrap"></p> <p>                            <button type="button" class="name">地 址 </p> <p>                        <div class="group-r"></p> <p>                            <div class="contant"></p> <p>                                新加坡</p> <p>                                <?php echo e(Input::get('address'))?>                           </p> <p>                <div class="ware"></p> <p>                    <div class="group"></p> <p>                        $gift = \App\Models\UserUpgradeGift::query()</p> <p>                            ->where('state',1)</p> <p>                            ->where('id',Input::get('gift'))</p> <p>                            ->first();</p> <p>                        if(!$gift)</p> <p>                            throw new \App\Business\Exceptions\BusinessException('请选择礼包!');</p> <p>                        ?>                        <div class="group-l"></p> <p>                            <div class="logo"><img src="<?=$gift->pic_url?>"></p> <p>                        <div class="group-r"></p> <p>                            <div class="group right top"></p> <p>                                <div class="group-l"></p> <p>                                    <div class="ware-main"></p> <p>                                        <div class="ware-name t-o"></p> <p>                                            <?=e($gift->goods_name)?>                                       </p> <p>                                        <div class="ware-spec"></p> <p>                                        <div class="ware-price"></p> <p>                                            <span class="now">¥<?=$gift->price?></p> <p>                                            <span class="old v-b">¥ <?=$gift->res_price?></p> <p>--></p> <p>                                <div class="group-r"></p> <p>                                    <div class="ware-count">x1</p> <p>        <input type="hidden" name="parentNo" value="<?php echo e(Input::get('parentNo'))?>"></p> <p>        <input type="hidden" name="type" value="<?php echo e(Input::get('hasstore'))?>"></p> <p>        <input type="hidden" name="giftId" value="<?php echo e(Input::get('gift'))?>"></p> <p>        <input type="hidden" name="phone" value="<?php echo e(Input::get('phone'))?>"></p> <p>        <input type="hidden" name="authcode" value="<?php echo e(Input::get('authcode'))?>"></p> <p>        <input type="hidden" name="name" value="<?php echo e(Input::get('name'))?>"></p> <p>        <input type="hidden" name="address" value="<?php echo e(Input::get('address'))?>"></p> <p>        <input type="hidden" name="business" value="UserUpgradeOrder"></p> <p>        <input type="hidden" name="province" value="2"></p> <p>        <input type="hidden" name="city" value="3"></p> <p>        <input type="hidden" name="area" value="4"></p> <p>        <input type="hidden" name="invitationCode" value="<?=$inviteCode?$inviteCode->code:''?>"></p> <p>        <input type="hidden" name="zipcode" value="<?php echo e(Input::get('zipcode'))?>"></p> <p>        <div class="foot"></p> <p>            <div class="group right"></p> <p>                <div class="group-l"></p> <p>                    <div class="amount"></p> <p>                        共 1件商品</p> <p>                        <div class="f-r"></p> <p>                            需支付<span class="price">S$<span id="pay_money"></span></span>元</p> <p>                <div class="group-r nowrap"></p> <p>                    <button type="button" class="confirm">立即支付</p> <p>        <div class="mark fade"></p> <p>        <div class="pay-mode bounce"  id="footers"></p> <p>            <div class="footers_top"></p> <p>                <span>支付方式</p> <p>                <div class="no_icon"></p> <p>                    <img src="<?=Config::get('app.url')?>/ononononon.png" alt=""></p> <p>            <div style="border-bottom:none"></p> <p>                <label class="mode" ></p> <p>                    <div class="i-alipay" style="background-image:url('<?=Config::get('app.url')?>/xinyongka.png')"></p> <p>                    <span class="pay-name v-t">新加坡信用卡</p> <p>                    <div class="checkbox f-r"></p> <p>                        <input type="radio"  name="payProvider" value="1" checked=""></p> <p>                <label class="mode" ></p> <p>                    <div class="i-alipay"></p> <p>                    <span class="pay-name v-t">支付宝支付</p> <p>                    <div class="checkbox f-r"></p> <p>                        <input type="radio"  name="payProvider"  value="2" ></p> <p>            <button type="submit" id="submitOrder" class="btn-submit" style="width:6.2rem; height:.8rem;  background:#F7A030;  position:absolute;  left:0;  right:0;  margin:auto; text-align:center; line-height:.8rem; color:#FFFFFF;font-size:.3rem; font-family:'PingFang-SC-Regular'; position:absolute; bottom:.4rem; left:0; right:0; margin:auto; border-radius:.12rem;">确认支付</p> <p>    <div class="Popup"></p> <p>        <div class="footers_top"></p> <p>            <span>支付方式</p> <p>            <div class="no_icon"></p> <p>                <img src="<?=Config::get('app.url')?>/ononononon.png" alt=""></p> <p>        <form action="/charge" method="post" id="payment-form"></p> <p>                <div class="form-row"></p> <p>                    <div id="card-element" style="margin-bottom:.2rem ;margin-top:.2rem"></p> <p>                    <label for="card-element" style=" font-family:'PingFang-SC-Regular'; color:#999999;font-size:.26rem;"></p> <p>                        填写您的银行卡号确认付款</p> <p>                    <div id="card-errors" role="alert" style="margin-top:.2rem;  font-family:'PingFang-SC-Regular'; color:#999999;font-size:.26rem;"></p> <p>                <button class="button" style="width:6.2rem; height:.8rem;  background:#F7A030;  position:absolute;  left:0;  right:0;  margin:auto; text-align:center; line-height:.8rem; color:#FFFFFF;font-size:.3rem; font-family:'PingFang-SC-Regular'; position:absolute; bottom:.4rem; left:0; right:0; margin:auto; border-radius:.12rem;" ></p> <p>                    确认支付</p> <p><script src="<?=Config::get('app.cdn01')?>/api_assert/script/zepto.min.js"></p> <p><script src="<?=Config::get('app.cdn01')?>/api_assert/script/index.min.js"></p> <p><script src="<?=Config::get('app.cdn01')?>/api_assert/script/expand.js"></p> <p><script src="https://js.stripe.com/v3/"></p> <p>    var msg =$("#btn").attr('data-message');</p> <p>    if(msg){</p> <p>$("#submitOrder").css({'display':'none'});</p> <p>        $(".confirm").css({'display':'none'});</p> <p>        App.alert(msg);</p> <p>    }</p> <p>App.ajaxWait({</p> <p>url:'<?=\Illuminate\Support\Facades\URL::to('app/userUpgrade/Money')?>',</p> <p>        data:{},</p> <p>        success:function(result){</p> <p>var hasstore ='<?php echo e(Input::get('hasstore'))?>';</p> <p>            if(hasstore==1){</p> <p>$("#pay_money").text(result['level_1_money'])</p> <p>}else{</p> <p>$("#pay_money").text(result['level_2_money'])</p> <p>}</p> <p>}</p> <p>})</p> <p>// Create a Stripe client.</p> <p>    var stripe = Stripe("<?= env('STRIPE_PUB_KEY') ?>");</p> <p>    // Create an instance of Elements.</p> <p>    var elements = stripe.elements();</p> <p>    // Custom styling can be passed to options when creating an Element.</p> <p>// (Note that this demo uses a wider set of styles than the guide below.)</p> <p>    var style = {</p> <p>base: {</p> <p>color:'#32325d',</p> <p>            lineHeight:'18px',</p> <p>            fontFamily:'"Helvetica Neue", Helvetica, sans-serif',</p> <p>            fontSmoothing:'antialiased',</p> <p>            fontSize:'16px',</p> <p>            '::placeholder': {</p> <p>color:'#aab7c4'</p> <p>            }</p> <p>},</p> <p>        invalid: {</p> <p>color:'#fa755a',</p> <p>            iconColor:'#fa755a'</p> <p>        }</p> <p>};</p> <p>    // Create an instance of the card Element.</p> <p>    var card = elements.create('card', {style: style});</p> <p>    // Add an instance of the card Element into the `card-element`</p> <p>.</p> <p>    card.mount('#card-element');</p> <p>    // Handle real-time validation errors from the card Element.</p> <p>    card.addEventListener('change', function(event) {</p> <p>var displayError = document.getElementById('card-errors');</p> <p>        if (event.error) {</p> <p>displayError.textContent = event.error.message;</p> <p>        }else {</p> <p>displayError.textContent ='';</p> <p>        }</p> <p>});</p> <p>    // Handle form submission.</p> <p>    $("#submitOrder").click((e)=>{</p> <p>e.preventDefault();</p> <p>        data =$(".step3").serializeArray();</p> <p>        data['pay_provider'] =1;</p> <p>        let parentNo='';</p> <p>        let type='';</p> <p>        let giftId='';</p> <p>        let phone='';</p> <p>        let authcode='';</p> <p>        let name='';</p> <p>        let address='';</p> <p>        let business='';</p> <p>        let province='';</p> <p>        let city='';</p> <p>        let area='';</p> <p>        let invitationCode='';</p> <p>        let zipcode='';</p> <p>        let payProvider='';</p> <p>        data.forEach((val,index)=> {</p> <p>if (val.name =="parentNo") {</p> <p>parentNo = val.value;</p> <p>            }</p> <p>else if (val.name =="type") {</p> <p>type = val.value;</p> <p>            }</p> <p>else if (val.name =="giftId") {</p> <p>giftId = val.value;</p> <p>            }</p> <p>else if (val.name =="phone") {</p> <p>phone = val.value;</p> <p>            }</p> <p>else if (val.name =="authcode") {</p> <p>authcode = val.value;</p> <p>            }</p> <p>else if (val.name =="name") {</p> <p>name = val.value;</p> <p>            }</p> <p>else if (val.name =="address") {</p> <p>address = val.value;</p> <p>            }</p> <p>else if (val.name =="business") {</p> <p>business = val.value;</p> <p>            }</p> <p>else if (val.name =="province") {</p> <p>province = val.value;</p> <p>            }</p> <p>else if (val.name =="city") {</p> <p>city = val.value;</p> <p>            }</p> <p>else if (val.name =="area") {</p> <p>area = val.value;</p> <p>            }</p> <p>else if (val.name =="invitationCode") {</p> <p>invitationCode = val.value;</p> <p>            }</p> <p>else if (val.name =="zipcode") {</p> <p>zipcode = val.value;</p> <p>            }</p> <p>else if (val.name =="payProvider") {</p> <p>payProvider = val.value;</p> <p>            }</p> <p>})</p> <p>// 表单提交标识</p> <p>        let flag =true;</p> <p>        if(payProvider==1){</p> <p>$(".Popup").css({"display":"block"});</p> <p>            $(".button").click((event) => {</p> <p>$(".pay-mode").hide();</p> <p>                event.stopPropagation();</p> <p>                event.preventDefault();</p> <p>                if(flag) {</p> <p>flag =false;</p> <p>                    stripe.createToken(card).then((result) => {</p> <p>if (result.error) {</p> <p>// Inform the user if there was an error.</p> <p>                            var errorElement = document.getElementById('card-errors');</p> <p>                            errorElement.textContent = result.error.message;</p> <p>                        }</p> <p>else {</p> <p>let token = result.token.id;</p> <p>                            setTimeout(()=>{</p> <p>flag =true;</p> <p>                            }, 3000);</p> <p>                            App.ajaxWait({</p> <p>url:"<?=\Illuminate\Support\Facades\URL::to('app/stripe/paidGift')?>",</p> <p>                                type:"POST",</p> <p>                                data: {</p> <p>'parentNo': parentNo,</p> <p>                                    'type': type,</p> <p>                                    'giftId': giftId,</p> <p>                                    'phone': phone,</p> <p>                                    'authcode': authcode,</p> <p>                                    'name': name,</p> <p>                                    'address': address,</p> <p>                                    'business': business,</p> <p>                                    'province': province,</p> <p>                                    'city': city,</p> <p>                                    'area': area,</p> <p>                                    'invitationCode': invitationCode,</p> <p>                                    'zipcode': zipcode,</p> <p>                                    'payProvider': payProvider,</p> <p>                                    'currency':"sgd",</p> <p>                                    'amount':"398",</p> <p>                                    'pay_type':2,</p> <p>                                    'source': token</p> <p>},</p> <p>                                success:function (res) {</p> <p>App.alert('支付成功!优品质、享购物、趣赚钱,即刻下载app吧!', function () {</p> <p>window.location.href ='/app/download';</p> <p>                                    });</p> <p>                                    flag =true;</p> <p>                                    // if (!res.data) {</p> <p>//</p> <p>// }</p> <p>// else {</p> <p>                                    //    App.alert(res && res.err_desc ? res.err_desc : '支付失败');</p> <p>// }</p> <p>                                }</p> <p>})</p> <p>}</p> <p>});</p> <p>                }</p> <p>})</p> <p>}</p> <p>else if(payProvider==2){</p> <p>App.ajaxWait({</p> <p>url:"xxxxxxxxx/app/stripe/createWebOrd",</p> <p>                type:"POST",</p> <p>                data: {</p> <p>'parentNo': parentNo,</p> <p>                    'type': type,</p> <p>                    'giftId': giftId,</p> <p>                    'phone': phone,</p> <p>                    'authcode': authcode,</p> <p>                    'name': name,</p> <p>                    'address': address,</p> <p>                    'business': business,</p> <p>                    'province': province,</p> <p>                    'city': city,</p> <p>                    'area': area,</p> <p>                    'invitationCode': invitationCode,</p> <p>                    'zipcode': zipcode,</p> <p>                    'payProvider': payProvider,</p> <p>                    'currency':"sgd",</p> <p>                    'amount':"398",</p> <p>                    'pay_type':2</p> <p>                },</p> <p>                success:function (res) {</p> <p>if (res.order_id) {</p> <p>function alipay(amount) {</p> <p>stripe.createSource({</p> <p>type:'alipay',</p> <p>                                amount:parseInt(amount),</p> <p>                                currency:'sgd', // usd, eur,        ***</p> <p>                                redirect: {</p> <p>return_url: res['return_url']</p> <p>},</p> <p>                                metadata: {</p> <p>'order_sn':res['trade_no'],</p> <p>                                    'order_id':res['order_id'],</p> <p>                                    'amount':amount,</p> <p>                                    'business':res['business'],</p> <p>                                  // 'ordered_at':res['created_at']</p> <p>                                },</p> <p>                            }).then(function (response) {</p> <p>if (response.error) {</p> <p>alert(response.error.message);</p> <p>                                }</p> <p>else {</p> <p>console.log(response);</p> <p>                                    processStripeResponse(response.source);</p> <p>                                }</p> <p>});</p> <p>                        }</p> <p>function processStripeResponse(source) {</p> <p>window.location.href = source.redirect.url;</p> <p>                        }</p> <p>alipay(res['amount']);</p> <p>                    }</p> <p>else {</p> <p>App.alert(res && res.err_desc ? res.err_desc :'支付失败');</p> <p>                    }</p> <p>}</p> <p>})</p> <p>}</p> <p>});</p> <p>    $(".confirm").click(function (e) {</p> <p>e.preventDefault();</p> <p>        showPay();</p> <p>    });</p> <p>    $(".mark").click(function (e) {</p> <p>e.preventDefault();</p> <p>        hidePay();</p> <p>    });</p> <p>    $(".no_icon").click((e)=>{</p> <p>e.preventDefault();</p> <p>        hidePay();</p> <p>    });</p> <p>    function showPay() {</p> <p>// $(".pay-mode").hide();</p> <p>        $(".pay-mode").show();</p> <p>        $(".mark").show();</p> <p>    }</p> <p>function hidePay() {</p> <p>$(".pay-mode").hide();</p> <p>        $(".mark").hide();</p> <p>        $(".Popup").css({'display':'none'});</p> <p>    }</p> </article> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1700183199956676608"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script> <!-- 文章页-底部 动态广告位 --> <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad"> <!-- 文章页-右侧1 动态广告位 --> <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div> <!-- 文章页-右侧2 动态广告位 --> <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div> <!-- 文章页-右侧3 动态广告位 --> <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(Stripe - 支付宝支付(前端))</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1880514091768934400.htm" title="JavaWeb 前端基础 html + CSS 快速入门 | 018" target="_blank">JavaWeb 前端基础 html + CSS 快速入门 | 018</a> <span class="text-muted">菜鸟阿康学习编程</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>今日推荐语指望别人的救赎,势必走向毁灭——波伏娃日期学习内容打卡编号2025年01月17日JavaWeb前端基础html+CSS018前言哈喽,我是菜鸟阿康。今天正式进入JavaWeb的学习,简单学习html+CSS这2各前端基础部分,以下是我的重点总结,希望对你有所帮助。(建议先看左侧目录,先了解文章结构)(请忽略错误的大纲编号,我直接从笔记中粘贴过来的,就没严格纠正了,重点在内容!)文末和主页</div> </li> <li><a href="/article/1880508669964120064.htm" title="【前端】20种 Button 样式" target="_blank">【前端】20种 Button 样式</a> <span class="text-muted">m0_74823264</span> <a class="tag" taget="_blank" href="/search/vip1024p/1.htm">vip1024p</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>20种Button样式在前端开发中,Button按钮的样式设计是提升用户交互体验的重要一环。以下是20种常见的Button样式,这些样式主要基于CSS实现,可以根据具体需求进行调整和组合。1.默认样式CSS样式:.button{background-color:#007bff;color:#fff;border:1pxsolid#007bff;}2.扁平样式CSS样式:.button{backgr</div> </li> <li><a href="/article/1880501610812076032.htm" title="前端HTML-将进酒" target="_blank">前端HTML-将进酒</a> <span class="text-muted">dgw2648633809</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>要求:实现:将进酒body{font-family:Arial,sans-serif;}h2{text-align:center;}p{text-indent:2em;margin:10px0;}img{float:left;margin-right:20px;}将进酒君不见黄河之水天上来君不见黄河之水天上来,奔流到海不复回。君不见高堂明镜悲白发,朝如青丝暮成雪。人生得意须尽欢,莫使金樽空对月。天</div> </li> <li><a href="/article/1880501609545396224.htm" title="前端HTML-网上转账电子账单" target="_blank">前端HTML-网上转账电子账单</a> <span class="text-muted">dgw2648633809</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>要求:实现:工商银行电子汇款单table{border-collapse:collapse;width:100%;}th,td{border:1pxsolidblack;padding:8px;text-align:left;}th{background-color:#f2f2f2;}工商银行电子汇款单回单类型网上转账汇款指令序号HQH00000000000000013878172收款人户名老牟付</div> </li> <li><a href="/article/1880479919276879872.htm" title="前端canvas对象转成file对象" target="_blank">前端canvas对象转成file对象</a> <span class="text-muted">小小弯_Shelby</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a> <div>importhtml2canvasfrom'html2canvas'exportdefault{methods:{//canvas对象转成file对象canvasToFile(){html2canvas(this.$parent.$refs['mapPanel'].$el,{width:this.$parent.$refs['mapPanel'].$el.clientWidth-600//heig</div> </li> <li><a href="/article/1880473231786307584.htm" title="TypeScript 学习笔记(七):TypeScript 与后端框架的结合应用" target="_blank">TypeScript 学习笔记(七):TypeScript 与后端框架的结合应用</a> <span class="text-muted">Evaporator Core</span> <a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>1.引言在前几篇学习笔记中,我们已经探讨了TypeScript的基础知识和在前端框架(如Angular和React)中的应用。本篇将重点介绍TypeScript在后端开发中的应用,特别是如何与Node.js和Express结合使用,以构建强类型、可维护的后端应用。2.TypeScript与Node.jsNode.js是一个基于ChromeV8引擎的JavaScript运行时,广泛用于构建后端应用。</div> </li> <li><a href="/article/1880470962999193600.htm" title="Node.js --- 模板引擎EJS" target="_blank">Node.js --- 模板引擎EJS</a> <span class="text-muted">蒜蓉大猩猩</span> <a class="tag" taget="_blank" href="/search/Node.js/1.htm">Node.js</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/express/1.htm">express</a><a class="tag" taget="_blank" href="/search/%E4%B8%AD%E9%97%B4%E4%BB%B6/1.htm">中间件</a> <div>1.前言模板引擎是一种工具或库,用于在开发中生成动态内容的HTML页面。它通过将预定义的模板与数据结合,生成最终的输出(如HTML页面、字符串等)。模板引擎广泛应用于前端和后端开发,尤其是在构建动态网站时。2.EJS模板引擎EJS(EmbeddedJavaScriptTemplates)是一种模板引擎,可以帮助我们在HTML页面中嵌入JavaScript代码,用于动态渲染内容。EJS语法简洁且与H</div> </li> <li><a href="/article/1880462644780003328.htm" title="大数据毕业设计—基于python+Django自然灾害频发地区情况数据分析系统" target="_blank">大数据毕业设计—基于python+Django自然灾害频发地区情况数据分析系统</a> <span class="text-muted">qq_1406299528</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1/1.htm">计算机毕业设计</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AE/1.htm">大数据</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a> <div>一、项目技术开发语言:Pythonpython框架:Django软件版本:python3.7/python3.8数据库:mysql5.7或更高版本数据库工具:Navicat11开发软件:PyCharm/vscode前端框架:vue.js二、项目内容和项目介绍  1.项目内容  1.开发语言:该系统采用Python作为开发语言,Python具有优雅的语法和动态类型,以及解释型语言的本质,使其成为许多</div> </li> <li><a href="/article/1880456086188781568.htm" title="vue 纯前端导出 Excel" target="_blank">vue 纯前端导出 Excel</a> <span class="text-muted">陈大大小</span> <a class="tag" taget="_blank" href="/search/1024%E7%A8%8B%E5%BA%8F%E5%91%98%E8%8A%82/1.htm">1024程序员节</a> <div>方法一:1、安装"file-saver"npmi-Sfile-saverxlsx2、引入在需要导出功能的.vue文件中引入importFileSaverfrom"file-saver";importXLSXfrom"xlsx";3、简单示例(复制即可食用):导出excel文件importFileSaverfrom"file-saver";importXLSXfrom"xlsx";exportdef</div> </li> <li><a href="/article/1880450542535241728.htm" title="【2025最新计算机毕业设计】基于SSM的旅游与自然保护平台【提供源码+答辩PPT+文档+项目部署】" target="_blank">【2025最新计算机毕业设计】基于SSM的旅游与自然保护平台【提供源码+答辩PPT+文档+项目部署】</a> <span class="text-muted">万码堂源码</span> <a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E6%AF%95%E8%AE%BE%E7%B2%BE%E5%93%81%E5%AE%9E%E6%88%98%E6%A1%88%E4%BE%8B/1.htm">计算机毕设精品实战案例</a><a class="tag" taget="_blank" href="/search/%E5%AE%9E%E6%88%98%E9%A1%B9%E7%9B%AE%E6%BA%90%E7%A0%81/1.htm">实战项目源码</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1/1.htm">计算机毕业设计</a><a class="tag" taget="_blank" href="/search/%E6%AF%95%E8%AE%BE%E9%A1%B9%E7%9B%AE/1.htm">毕设项目</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a> <div>作者简介:✌CSDN新星计划导师、Java领域优质创作者、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流。✌主要内容:Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能与大数据、单片机开发、物联网设计与开发设计、简历模板、学习资料、面试题库、技术互助、就业指导等。业务范围:免费功能设计、开题报告、任务书</div> </li> <li><a href="/article/1880450416257331200.htm" title="【源码+文档】基于SpringBoot+Vue旅游网站系统【提供源码+答辩PPT+参考文档+项目部署】" target="_blank">【源码+文档】基于SpringBoot+Vue旅游网站系统【提供源码+答辩PPT+参考文档+项目部署】</a> <span class="text-muted">万码堂源码</span> <a class="tag" taget="_blank" href="/search/%E5%AE%9E%E6%88%98%E9%A1%B9%E7%9B%AE%E6%BA%90%E7%A0%81/1.htm">实战项目源码</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E6%AF%95%E8%AE%BE%E7%B2%BE%E5%93%81%E5%AE%9E%E6%88%98%E6%A1%88%E4%BE%8B/1.htm">计算机毕设精品实战案例</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a> <div>作者简介:✌CSDN新星计划导师、Java领域优质创作者、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流。✌主要内容:Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能与大数据、单片机开发、物联网设计与开发设计、简历模板、学习资料、面试题库、技术互助、就业指导等。业务范围:免费功能设计、开题报告、任务书</div> </li> <li><a href="/article/1880430491719495680.htm" title="Yii框架中的日历控件如何实现日期选择器" target="_blank">Yii框架中的日历控件如何实现日期选择器</a> <span class="text-muted">ac-er8888</span> <a class="tag" taget="_blank" href="/search/php/1.htm">php</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>在Yii框架中,虽然Yii本身不直接提供一个内置的日历控件用于日期选择器,但你可以利用Yii的扩展包或者结合前端库(如jQueryUIDatepicker、BootstrapDatepicker等)来实现这一功能。以下是一些常见的方法来实现日期选择器:1.使用jQueryUIDatepickerjQueryUI是一个流行的jQuery插件集,其中包含了日期选择器组件。你可以通过以下步骤在Yii中集</div> </li> <li><a href="/article/1880428729457504256.htm" title="基于JAVA面向餐饮行业的会员营销系统计算机毕业设计源码+数据库+lw文档+系统+部署" target="_blank">基于JAVA面向餐饮行业的会员营销系统计算机毕业设计源码+数据库+lw文档+系统+部署</a> <span class="text-muted">匠心网络</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>基于JAVA面向餐饮行业的会员营销系统计算机毕业设计源码+数据库+lw文档+系统+部署基于JAVA面向餐饮行业的会员营销系统计算机毕业设计源码+数据库+lw文档+系统+部署本源码技术栈:项目架构:B/S架构开发语言:Java语言开发软件:ideaeclipse前端技术:Layui、HTML、CSS、JS、JQuery等技术后端技术:JAVA运行环境:Win10、JDK1.8数据库:MySQL5.7</div> </li> <li><a href="/article/1880422300294115328.htm" title="前端接口报500如何解决 发生的原因以及处理步骤" target="_blank">前端接口报500如何解决 发生的原因以及处理步骤</a> <span class="text-muted">m0_74823863</span> <a class="tag" taget="_blank" href="/search/vip1024p/1.htm">vip1024p</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>接口500,通常指的是服务器内部错误(InternalServerError),是HTTP协议中的一个标准状态码。当服务器遇到无法处理的错误时,会返回这个状态码。这种错误可能涉及到服务器配置、服务器上的应用程序、服务器资源、数据库、网络连接等多种原因。一、接口500错误的可能原因服务器端代码错误:语法错误:如拼写错误、缺少关键结尾等。逻辑错误:程序逻辑不正确,导致运行时异常。异常处理不当:如空指针</div> </li> <li><a href="/article/1880413974210605056.htm" title="java毕业设计宠物领养饲养交流管理平台Mybatis+系统+数据库+调试部署" target="_blank">java毕业设计宠物领养饲养交流管理平台Mybatis+系统+数据库+调试部署</a> <span class="text-muted">静静学姐</span> <a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AE%A0%E7%89%A9/1.htm">宠物</a> <div>java毕业设计宠物领养饲养交流管理平台Mybatis+系统+数据库+调试部署java毕业设计宠物领养饲养交流管理平台Mybatis+系统+数据库+调试部署本源码技术栈:项目架构:B/S架构开发语言:Java语言开发软件:ideaeclipse前端技术:Layui、HTML、CSS、JS、JQuery等技术后端技术:JAVA运行环境:Win10、JDK1.8数据库:MySQL5.7/8.0源码地址</div> </li> <li><a href="/article/1880406911166246912.htm" title="Vue中常见设计模式的应用~" target="_blank">Vue中常见设计模式的应用~</a> <span class="text-muted">Warm</span> <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>Vue是基于什么模式?表示既然是Vue中常见的设计模式,首当其冲就先聊聊MVVM模式啦一、mvvm模式Vue.js是一个基于MVVM设计模式的前端框架。它将前端中的UI视图与底层数据和业务逻辑分离开来,使得UI视图与数据和业务逻辑之间不存在耦合性,可以独立编写和测试。MVVM三个组成部分Model(模型):存放业务数据和对数据的操作等View(视图):用户界面,负责呈现UI,并向ViewModel</div> </li> <li><a href="/article/1880405144043057152.htm" title="前端框架: Vue3组件设计模式" target="_blank">前端框架: Vue3组件设计模式</a> <span class="text-muted">苹果酱0567</span> <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E9%A2%98%E6%B1%87%E6%80%BB%E4%B8%8E%E8%A7%A3%E6%9E%90/1.htm">面试题汇总与解析</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>前端框架:Vue3组件设计模式在前端开发中,Vue框架一直受到开发者的喜爱。它不仅易于上手,而且功能丰富,尤其是在Vue3中引入了CompositionAPI和Teleport等新特性,进一步提升了开发体验。在Vue3中,组件设计模式是一个非常重要的话题,良好的组件设计模式可以提高代码的可维护性和可扩展性,本文将深入探讨Vue3组件设计模式的相关内容。一、组件化开发模式组件化概念及优势在前端开发中</div> </li> <li><a href="/article/1880395432257974272.htm" title="【Rust】——不安全Rust" target="_blank">【Rust】——不安全Rust</a> <span class="text-muted">Y小夜</span> <a class="tag" taget="_blank" href="/search/Rust%EF%BC%88%E5%AE%98%E6%96%B9%E6%96%87%E6%A1%A3%E9%87%8D%E7%82%B9%E6%80%BB%E7%BB%93%EF%BC%89/1.htm">Rust(官方文档重点总结)</a><a class="tag" taget="_blank" href="/search/rust/1.htm">rust</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a> <div>博主现有专栏:C51单片机(STC89C516),c语言,c++,离散数学,算法设计与分析,数据结构,Python,Java基础,MySQL,linux,基于HTML5的网页设计及应用,Rust(官方文档重点总结),jQuery,前端vue.js,Javaweb开发,Python机器学习等主页链接:Y小夜-CSDN博客目录不安全的超能力解引用裸指针调用不安全函数或方法创建不安全代码的安全抽象使用e</div> </li> <li><a href="/article/1880386105950400512.htm" title="vite-ant-design-pro 使用指南" target="_blank">vite-ant-design-pro 使用指南</a> <span class="text-muted">裴若音Nola</span> <div>vite-ant-design-pro使用指南vite-ant-design-proAntDesignProbasedonVite项目地址:https://gitcode.com/gh_mirrors/vi/vite-ant-design-pro项目介绍vite-ant-design-pro是一个基于Vite和AntDesign的现代前端项目模板。它集成了最新的前端技术栈,旨在提供一个高效且强大的</div> </li> <li><a href="/article/1880384718378168320.htm" title="Vue2实现上传图片到阿里云的OSS对象存储" target="_blank">Vue2实现上传图片到阿里云的OSS对象存储</a> <span class="text-muted">秋意钟</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>在Vue2项目中,将图片上传到阿里云的OSS(对象存储)需要几个步骤,包括配置阿里云OSS、获取上传凭证、在前端进行上传操作等。以下是一个详细的实现步骤:1.配置阿里云OSS首先,你需要在阿里云OSS上创建一个存储桶(Bucket),并配置好相关的权限。2.后端获取上传凭证由于直接暴露OSS的AccessKeyID和AccessKeySecret到前端是不安全的,所以需要通过后端服务器来获取一个临</div> </li> <li><a href="/article/1880374253124120576.htm" title="高级Python Web开发:FastAPI的前后端集成与API性能优化" target="_blank">高级Python Web开发:FastAPI的前后端集成与API性能优化</a> <span class="text-muted">Switch616</span> <a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/fastapi/1.htm">fastapi</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>高级PythonWeb开发:FastAPI的前后端集成与API性能优化目录️前后端集成的基本原理与实践FastAPI的API设计与实现API性能测试与负载测试使用Locust进行API性能测试使用ApacheJMeter进行API性能测试自动化性能测试用例与性能瓶颈分析编写性能测试用例性能瓶颈的定位与分析1.️前后端集成的基本原理与实践在现代Web开发中,前后端分离已成为主流架构。前端与后端通过A</div> </li> <li><a href="/article/1880325967138844672.htm" title="通过付款码来区分是属于支付宝、微信" target="_blank">通过付款码来区分是属于支付宝、微信</a> <span class="text-muted">笑醉踏歌行</span> <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1/1.htm">微信</a> <div>微信支付码规则:18位纯数字,以10、11、12、13、14、15开头支付宝支付码规则:25-30开头的长度为16~24位的数字,实际字符串长度以开发者获取的付款码长度为准</div> </li> <li><a href="/article/1880323948567130112.htm" title="参数校验 Spring Validation框架" target="_blank">参数校验 Spring Validation框架</a> <span class="text-muted">唯手熟</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a> <div>后端参数校验解决:校验前端传入的参数是否符合预期1、引入依赖使用SpringValidation框架              org.springframework.boot      spring-boot-starter-validation      3.1.4    2、校验类型直接属性校验对象属性校验2.1直接属性校验在参数接收时,直接使用正则表达式对属性进行限制。控制层添加注解@Va</div> </li> <li><a href="/article/1880282086548500480.htm" title="视觉SLAM学习打卡【8-1】-视觉里程计·直接法" target="_blank">视觉SLAM学习打卡【8-1】-视觉里程计·直接法</a> <span class="text-muted">肝帝永垂不朽</span> <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/SLAM/1.htm">SLAM</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E8%A7%86%E8%A7%89/1.htm">计算机视觉</a><a class="tag" taget="_blank" href="/search/opencv/1.htm">opencv</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a> <div>本节直接法与上节特征点法,为视觉里程计估计位姿的两大主流方法。而在引出直接法前,先介绍光流法(二者均对灰度值I做文章)。至此,前端VO总算结束了。学下来一个感受就是前几章的数学基础很重要,尤其是构建最小二乘的非线性优化(BA),几乎每种方法都有其一席之地。视觉SLAM学习打卡【8-1】-视觉里程计·直接法一、光流法(1)前提(实际中较难满足)(2)理论推导(3)附:超定方程求解二、直接法(1)理论</div> </li> <li><a href="/article/1880279567311106048.htm" title="海康威视H5player问题汇总大全" target="_blank">海康威视H5player问题汇总大全</a> <span class="text-muted">前端小码仔</span> <a class="tag" taget="_blank" href="/search/%E6%B5%B7%E5%BA%B7%E8%A7%86%E9%A2%91/1.htm">海康视频</a><a class="tag" taget="_blank" href="/search/%E6%B5%B7%E5%BA%B7H5player/1.htm">海康H5player</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>由于除了要支持Windows平台,还要支持国产系统的平台,这时就用到了H5player,但是这个在使用调试的时候会遇到各种各样的问题,便在此分享一下,供大家分享!!!问题一:Unexpectedtoken‘<‘inputover1、检查html页面的引入2、确认szBasePath地址是否正确(注意:微前端乾坤下的路径别忘带子应用的前缀)3、如果以上配置都正确,且后端返回的路径没问题,请重新下载更</div> </li> <li><a href="/article/1880272744013164544.htm" title="在线购物商城系统源码,JSP+servlet+MySQL,idea,eclipse" target="_blank">在线购物商城系统源码,JSP+servlet+MySQL,idea,eclipse</a> <span class="text-muted">stxy178</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>在线购物商城系统是一个非常热门的开发项目,通过JSP+servlet+MySQL这一技术组合,可以实现一个功能完善的商城系统。本文将介绍如何使用IDEA和Eclipse来进行开发,并简要介绍数据库设计和系统功能。首先,我们需要创建一个新的Web项目,并选择JSP作为前端技术,servlet作为后端技术,MySQL作为数据库。可以使用IDEA或者Eclipse来进行开发,具体选择哪个IDE根据个人喜</div> </li> <li><a href="/article/1880267823134076928.htm" title="解决Spring+Vue的跨域问题" target="_blank">解决Spring+Vue的跨域问题</a> <span class="text-muted">eqa11</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>文章目录解决Spring+Vue的跨域问题一、引言二、前端Vue配置代理解决跨域1、配置代理2、使用axios发送请求三、后端Spring配置解决跨域1、全局配置跨域策略四、使用示例五、总结解决Spring+Vue的跨域问题一、引言在前后端分离的开发模式中,Spring和Vue是常用的后端和前端框架。然而,在开发过程中,我们经常会遇到跨域问题,即浏览器出于安全考虑,限制了不同源之间的请求。本文将介</div> </li> <li><a href="/article/1880244355898339328.htm" title="【免费】谷歌浏览器chrome chromedriver 131.0.6778.24 win64 下载" target="_blank">【免费】谷歌浏览器chrome chromedriver 131.0.6778.24 win64 下载</a> <span class="text-muted">圣phoenix</span> <a class="tag" taget="_blank" href="/search/chrome/1.htm">chrome</a> <div>首先,检查电脑上的Chrome版本是否131.*;确认了版本是131;(只要chrome版本号前端一致就可以)再下载这个driver到指定的目录上。(一般放本地电脑的/usr/local/bin目录下,或者python集中调用的电脑的/python/chromedriver,主要看应用场景)</div> </li> <li><a href="/article/1880236275684929536.htm" title="2024年最新Python:Page Object设计模式_python page object,BTAJ大厂最新面试题汇集" target="_blank">2024年最新Python:Page Object设计模式_python page object,BTAJ大厂最新面试题汇集</a> <span class="text-muted">m0_60707708</span> <a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98/1.htm">程序员</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>最后硬核资料:关注即可领取PPT模板、简历模板、行业经典书籍PDF。技术互助:技术群大佬指点迷津,你的问题可能不是问题,求资源在群里喊一声。面试题库:由技术群里的小伙伴们共同投稿,热乎的大厂面试真题,持续更新中。知识体系:含编程语言、算法、大数据生态圈组件(Mysql、Hive、Spark、Flink)、数据仓库、Python、前端等等。网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是</div> </li> <li><a href="/article/1880226614776754176.htm" title="日期和时间数据类型的深入探讨:理论与实践" target="_blank">日期和时间数据类型的深入探讨:理论与实践</a> <span class="text-muted"></span> <div>title:日期和时间数据类型的深入探讨:理论与实践date:2025/1/3updated:2025/1/3author:cmdragonexcerpt:日期和时间数据类型在数据库管理系统中扮演着重要角色,尤其是在数据分析、时间序列数据和事件追踪等领域。这些数据类型不仅可以准确表示时间信息,还能在信息检索、数据存储和计算功能上发挥重要作用。categories:前端开发tags:日期和时间数据库</div> </li> <li><a href="/article/77.htm" title="算法 单链的创建与删除" target="_blank">算法 单链的创建与删除</a> <span class="text-muted">换个号韩国红果果</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div> 先创建结构体 struct student { int data; //int tag;//标记这是第几个 struct student *next; }; // addone 用于将一个数插入已从小到大排好序的链中 struct student *addone(struct student *h,int x){ if(h==NULL) //?????? </div> </li> <li><a href="/article/204.htm" title="《大型网站系统与Java中间件实践》第2章读后感" target="_blank">《大型网站系统与Java中间件实践》第2章读后感</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/java%E4%B8%AD%E9%97%B4%E4%BB%B6/1.htm">java中间件</a> <div>       断断续续花了两天时间试读了《大型网站系统与Java中间件实践》的第2章,这章总述了从一个小型单机构建的网站发展到大型网站的演化过程---整个过程会遇到很多困难,但每一个屏障都会有解决方案,最终就是依靠这些个解决方案汇聚到一起组成了一个健壮稳定高效的大型系统。          看完整章内容,</div> </li> <li><a href="/article/331.htm" title="zeus持久层spring事务单元测试" target="_blank">zeus持久层spring事务单元测试</a> <span class="text-muted">deng520159</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/jdbc/1.htm">jdbc</a> <div>今天把zeus事务单元测试放出来,让大家指出他的毛病, 1.ZeusTransactionTest.java 单元测试   package com.dengliang.zeus.webdemo.test; import java.util.ArrayList; import java.util.List; import org.junit.Test; import </div> </li> <li><a href="/article/458.htm" title="Rss 订阅 开发" target="_blank">Rss 订阅 开发</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/%E8%AE%A2%E9%98%85/1.htm">订阅</a><a class="tag" taget="_blank" href="/search/rss/1.htm">rss</a><a class="tag" taget="_blank" href="/search/%E8%A7%84%E8%8C%83/1.htm">规范</a> <div>                RSS是 Really Simple Syndication的缩写(对rss2.0而言,是这三个词的缩写,对rss1.0而言则是RDF Site Summary的缩写,1.0与2.0走的是两个体系)。   RSS</div> </li> <li><a href="/article/585.htm" title="分页查询实现" target="_blank">分页查询实现</a> <span class="text-muted">g21121</span> <a class="tag" taget="_blank" href="/search/%E5%88%86%E9%A1%B5%E6%9F%A5%E8%AF%A2/1.htm">分页查询</a> <div>在查询列表时我们常常会用到分页,分页的好处就是减少数据交换,每次查询一定数量减少数据库压力等等。 按实现形式分前台分页和服务器分页: 前台分页就是一次查询出所有记录,在页面中用js进行虚拟分页,这种形式在数据量较小时优势比较明显,一次加载就不必再访问服务器了,但当数据量较大时会对页面造成压力,传输速度也会大幅下降。 服务器分页就是每次请求相同数量记录,按一定规则排序,每次取一定序号直接的数据</div> </li> <li><a href="/article/712.htm" title="spring jms异步消息处理" target="_blank">spring jms异步消息处理</a> <span class="text-muted">510888780</span> <a class="tag" taget="_blank" href="/search/jms/1.htm">jms</a> <div>spring JMS对于异步消息处理基本上只需配置下就能进行高效的处理。其核心就是消息侦听器容器,常用的类就是DefaultMessageListenerContainer。该容器可配置侦听器的并发数量,以及配合MessageListenerAdapter使用消息驱动POJO进行消息处理。且消息驱动POJO是放入TaskExecutor中进行处理,进一步提高性能,减少侦听器的阻塞。具体配置如下: </div> </li> <li><a href="/article/839.htm" title="highCharts柱状图" target="_blank">highCharts柱状图</a> <span class="text-muted">布衣凌宇</span> <a class="tag" taget="_blank" href="/search/hightCharts/1.htm">hightCharts</a><a class="tag" taget="_blank" href="/search/%E6%9F%B1%E5%9B%BE/1.htm">柱图</a> <div>第一步:导入 exporting.js,grid.js,highcharts.js;第二步:写controller   @Controller@RequestMapping(value="${adminPath}/statistick")public class StatistickController {  private UserServi</div> </li> <li><a href="/article/966.htm" title="我的spring学习笔记2-IoC(反向控制 依赖注入)" target="_blank">我的spring学习笔记2-IoC(反向控制 依赖注入)</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/mvc/1.htm">mvc</a><a class="tag" taget="_blank" href="/search/Spring+%E6%95%99%E7%A8%8B/1.htm">Spring 教程</a><a class="tag" taget="_blank" href="/search/spring3+%E6%95%99%E7%A8%8B/1.htm">spring3 教程</a><a class="tag" taget="_blank" href="/search/Spring+%E5%85%A5%E9%97%A8/1.htm">Spring 入门</a> <div>IoC(反向控制 依赖注入)这是Spring提出来了,这也是Spring一大特色。这里我不用多说,我们看Spring教程就可以了解。当然我们不用Spring也可以用IoC,下面我将介绍不用Spring的IoC。 IoC不是框架,她是java的技术,如今大多数轻量级的容器都会用到IoC技术。这里我就用一个例子来说明: 如:程序中有 Mysql.calss 、Oracle.class 、SqlSe</div> </li> <li><a href="/article/1093.htm" title="TLS java简单实现" target="_blank">TLS java简单实现</a> <span class="text-muted">antlove</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/ssl/1.htm">ssl</a><a class="tag" taget="_blank" href="/search/keystore/1.htm">keystore</a><a class="tag" taget="_blank" href="/search/tls/1.htm">tls</a><a class="tag" taget="_blank" href="/search/secure/1.htm">secure</a> <div>  1. SSLServer.java package ssl; import java.io.FileInputStream; import java.io.InputStream; import java.net.ServerSocket; import java.net.Socket; import java.security.KeyStore; import </div> </li> <li><a href="/article/1220.htm" title="Zip解压压缩文件" target="_blank">Zip解压压缩文件</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/Zip%E6%A0%BC%E5%BC%8F%E8%A7%A3%E5%8E%8B/1.htm">Zip格式解压</a><a class="tag" taget="_blank" href="/search/Zip%E6%B5%81%E7%9A%84%E4%BD%BF%E7%94%A8/1.htm">Zip流的使用</a><a class="tag" taget="_blank" href="/search/%E6%96%87%E4%BB%B6%E8%A7%A3%E5%8E%8B/1.htm">文件解压</a> <div>   ZIP文件的解压缩实质上就是从输入流中读取数据。Java.util.zip包提供了类ZipInputStream来读取ZIP文件,下面的代码段创建了一个输入流来读取ZIP格式的文件; ZipInputStream in = new ZipInputStream(new FileInputStream(zipFileName));     &n</div> </li> <li><a href="/article/1347.htm" title="underscore.js 学习(一)" target="_blank">underscore.js 学习(一)</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/underscore/1.htm">underscore</a> <div>        工作中需要用到underscore.js,发现这是一个包括了很多基本功能函数的js库,里面有很多实用的函数。而且它没有扩展 javascript的原生对象。主要涉及对Collection、Object、Array、Function的操作。       学</div> </li> <li><a href="/article/1474.htm" title="java jvm常用命令工具——jstatd命令(Java Statistics Monitoring Daemon)" target="_blank">java jvm常用命令工具——jstatd命令(Java Statistics Monitoring Daemon)</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/jstatd/1.htm">jstatd</a> <div>1.介绍         jstatd是一个基于RMI(Remove Method Invocation)的服务程序,它用于监控基于HotSpot的JVM中资源的创建及销毁,并且提供了一个远程接口允许远程的监控工具连接到本地的JVM执行命令。         jstatd是基于RMI的,所以在运行jstatd的服务</div> </li> <li><a href="/article/1601.htm" title="【Spring框架三】Spring常用注解之Transactional" target="_blank">【Spring框架三】Spring常用注解之Transactional</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/transactional/1.htm">transactional</a> <div>Spring可以通过注解@Transactional来为业务逻辑层的方法(调用DAO完成持久化动作)添加事务能力,如下是@Transactional注解的定义:   /* * Copyright 2002-2010 the original author or authors. * * Licensed under the Apache License, Version </div> </li> <li><a href="/article/1728.htm" title="我(程序员)的前进方向" target="_blank">我(程序员)的前进方向</a> <span class="text-muted">bitray</span> <a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98/1.htm">程序员</a> <div>作为一个普通的程序员,我一直游走在java语言中,java也确实让我有了很多的体会.不过随着学习的深入,java语言的新技术产生的越来越多,从最初期的javase,我逐渐开始转变到ssh,ssi,这种主流的码农,.过了几天为了解决新问题,webservice的大旗也被我祭出来了,又过了些日子jms架构的activemq也开始必须学习了.再后来开始了一系列技术学习,osgi,restful.....</div> </li> <li><a href="/article/1855.htm" title="nginx lua开发经验总结" target="_blank">nginx lua开发经验总结</a> <span class="text-muted">ronin47</span> <div>使用nginx lua已经两三个月了,项目接开发完毕了,这几天准备上线并且跟高德地图对接。回顾下来lua在项目中占得必中还是比较大的,跟PHP的占比差不多持平了,因此在开发中遇到一些问题备忘一下 1:content_by_lua中代码容量有限制,一般不要写太多代码,正常编写代码一般在100行左右(具体容量没有细心测哈哈,在4kb左右),如果超出了则重启nginx的时候会报 too long pa</div> </li> <li><a href="/article/1982.htm" title="java-66-用递归颠倒一个栈。例如输入栈{1,2,3,4,5},1在栈顶。颠倒之后的栈为{5,4,3,2,1},5处在栈顶" target="_blank">java-66-用递归颠倒一个栈。例如输入栈{1,2,3,4,5},1在栈顶。颠倒之后的栈为{5,4,3,2,1},5处在栈顶</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> import java.util.Stack; public class ReverseStackRecursive { /** * Q 66.颠倒栈。 * 题目:用递归颠倒一个栈。例如输入栈{1,2,3,4,5},1在栈顶。 * 颠倒之后的栈为{5,4,3,2,1},5处在栈顶。 *1. Pop the top element *2. Revers</div> </li> <li><a href="/article/2109.htm" title="正确理解Linux内存占用过高的问题" target="_blank">正确理解Linux内存占用过高的问题</a> <span class="text-muted">cfyme</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>Linux开机后,使用top命令查看,4G物理内存发现已使用的多大3.2G,占用率高达80%以上: Mem:   3889836k total,  3341868k used,   547968k free,   286044k buffers Swap:  6127608k total,&nb</div> </li> <li><a href="/article/2236.htm" title="[JWFD开源工作流]当前流程引擎设计的一个急需解决的问题" target="_blank">[JWFD开源工作流]当前流程引擎设计的一个急需解决的问题</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C%E6%B5%81/1.htm">工作流</a> <div>      当我们的流程引擎进入IRC阶段的时候,当循环反馈模型出现之后,每次循环都会导致一大堆节点内存数据残留在系统内存中,循环的次数越多,这些残留数据将导致系统内存溢出,并使得引擎崩溃。。。。。。       而解决办法就是利用汇编语言或者其它系统编程语言,在引擎运行时,把这些残留数据清除掉。</div> </li> <li><a href="/article/2363.htm" title="自定义类的equals函数" target="_blank">自定义类的equals函数</a> <span class="text-muted">dai_lm</span> <a class="tag" taget="_blank" href="/search/equals/1.htm">equals</a> <div>仅作笔记使用 public class VectorQueue { private final Vector<VectorItem> queue; private class VectorItem { private final Object item; private final int quantity; public VectorI</div> </li> <li><a href="/article/2490.htm" title="Linux下安装R语言" target="_blank">Linux下安装R语言</a> <span class="text-muted">datageek</span> <a class="tag" taget="_blank" href="/search/R%E8%AF%AD%E8%A8%80+linux/1.htm">R语言 linux</a> <div>命令如下:sudo gedit  /etc/apt/sources.list1、deb http://mirrors.ustc.edu.cn/CRAN/bin/linux/ubuntu/ precise/ 2、deb http://dk.archive.ubuntu.com/ubuntu hardy universesudo apt-key adv --keyserver ke</div> </li> <li><a href="/article/2617.htm" title="如何修改mysql 并发数(连接数)最大值" target="_blank">如何修改mysql 并发数(连接数)最大值</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>MySQL的连接数最大值跟MySQL没关系,主要看系统和业务逻辑了   方法一:进入MYSQL安装目录 打开MYSQL配置文件 my.ini 或 my.cnf查找 max_connections=100 修改为 max_connections=1000 服务里重起MYSQL即可   方法二:MySQL的最大连接数默认是100客户端登录:mysql -uusername -ppass</div> </li> <li><a href="/article/2744.htm" title="单一功能原则" target="_blank">单一功能原则</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E5%90%91%E5%AF%B9%E8%B1%A1%E7%9A%84%E7%A8%8B%E5%BA%8F%E8%AE%BE%E8%AE%A1/1.htm">面向对象的程序设计</a><a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E8%AE%BE%E8%AE%A1/1.htm">软件设计</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E5%8E%9F%E5%88%99/1.htm">编程原则</a> <div>单一功能原则[ 编辑]     SOLID 原则 单一功能原则 开闭原则 Liskov代换原则 接口隔离原则 依赖反转原则 查   论   编 在面向对象编程领域中,单一功能原则(Single responsibility principle)规定每个类都应该有</div> </li> <li><a href="/article/2871.htm" title="POJO、VO和JavaBean区别和联系" target="_blank">POJO、VO和JavaBean区别和联系</a> <span class="text-muted">fanmingxing</span> <a class="tag" taget="_blank" href="/search/VO/1.htm">VO</a><a class="tag" taget="_blank" href="/search/POJO/1.htm">POJO</a><a class="tag" taget="_blank" href="/search/javabean/1.htm">javabean</a> <div>POJO和JavaBean是我们常见的两个关键字,一般容易混淆,POJO全称是Plain Ordinary Java Object / Plain Old Java Object,中文可以翻译成:普通Java类,具有一部分getter/setter方法的那种类就可以称作POJO,但是JavaBean则比POJO复杂很多,JavaBean是一种组件技术,就好像你做了一个扳子,而这个扳子会在很多地方被</div> </li> <li><a href="/article/2998.htm" title="SpringSecurity3.X--LDAP:AD配置" target="_blank">SpringSecurity3.X--LDAP:AD配置</a> <span class="text-muted">hanqunfeng</span> <a class="tag" taget="_blank" href="/search/SpringSecurity/1.htm">SpringSecurity</a> <div>前面介绍过基于本地数据库验证的方式,参考http://hanqunfeng.iteye.com/blog/1155226,这里说一下如何修改为使用AD进行身份验证【只对用户名和密码进行验证,权限依旧存储在本地数据库中】。   将配置文件中的如下部分删除: <!-- 认证管理器,使用自定义的UserDetailsService,并对密码采用md5加密--> </div> </li> <li><a href="/article/3125.htm" title="mac mysql 修改密码" target="_blank">mac mysql 修改密码</a> <span class="text-muted">IXHONG</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>$ sudo /usr/local/mysql/bin/mysqld_safe –user=root & //启动MySQL(也可以通过偏好设置面板来启动)$ sudo /usr/local/mysql/bin/mysqladmin -uroot password yourpassword //设置MySQL密码(注意,这是第一次MySQL密码为空的时候的设置命令,如果是修改密码,还需在-</div> </li> <li><a href="/article/3252.htm" title="设计模式--抽象工厂模式" target="_blank">设计模式--抽象工厂模式</a> <span class="text-muted">kerryg</span> <a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a> <div>抽象工厂模式:     工厂模式有一个问题就是,类的创建依赖于工厂类,也就是说,如果想要拓展程序,必须对工厂类进行修改,这违背了闭包原则。我们采用抽象工厂模式,创建多个工厂类,这样一旦需要增加新的功能,直接增加新的工厂类就可以了,不需要修改之前的代码。     总结:这个模式的好处就是,如果想增加一个功能,就需要做一个实现类,</div> </li> <li><a href="/article/3379.htm" title="评"高中女生军训期跳楼”" target="_blank">评"高中女生军训期跳楼”</a> <span class="text-muted">nannan408</span> <div>   首先,先抛出我的观点,各位看官少点砖头。那就是,中国的差异化教育必须做起来。    孔圣人有云:有教无类。不同类型的人,都应该有对应的教育方法。目前中国的一体化教育,不知道已经扼杀了多少创造性人才。我们出不了爱迪生,出不了爱因斯坦,很大原因,是我们的培养思路错了,我们是第一要“顺从”。如果不顺从,我们的学校,就会用各种方法,罚站,罚写作业,各种罚。军</div> </li> <li><a href="/article/3506.htm" title="scala如何读取和写入文件内容?" target="_blank">scala如何读取和写入文件内容?</a> <span class="text-muted">qindongliang1922</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>直接看如下代码: package file import java.io.RandomAccessFile import java.nio.charset.Charset import scala.io.Source import scala.reflect.io.{File, Path} /** * Created by qindongliang on 2015/</div> </li> <li><a href="/article/3633.htm" title="C语言算法之百元买百鸡" target="_blank">C语言算法之百元买百鸡</a> <span class="text-muted">qiufeihu</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>中国古代数学家张丘建在他的《算经》中提出了一个著名的“百钱买百鸡问题”,鸡翁一,值钱五,鸡母一,值钱三,鸡雏三,值钱一,百钱买百鸡,问翁,母,雏各几何? 代码如下: #include <stdio.h> int main() { int cock,hen,chick; /*定义变量为基本整型*/ for(coc</div> </li> <li><a href="/article/3760.htm" title="Hadoop集群安全性:Hadoop中Namenode单点故障的解决方案及详细介绍AvatarNode" target="_blank">Hadoop集群安全性:Hadoop中Namenode单点故障的解决方案及详细介绍AvatarNode</a> <span class="text-muted">wyz2009107220</span> <a class="tag" taget="_blank" href="/search/NameNode/1.htm">NameNode</a> <div>正如大家所知,NameNode在Hadoop系统中存在单点故障问题,这个对于标榜高可用性的Hadoop来说一直是个软肋。本文讨论一下为了解决这个问题而存在的几个solution。 1. Secondary NameNode 原理:Secondary NN会定期的从NN中读取editlog,与自己存储的Image进行合并形成新的metadata image 优点:Hadoop较早的版本都自带,</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类:</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </div> </div> </footer> <!-- 代码高亮 --> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>